Hướng dẫn how do you display text in html? - làm thế nào để bạn hiển thị văn bản trong html?


HTML chứa một số yếu tố để xác định văn bản với một ý nghĩa đặc biệt.


Thí dụ

Văn bản này táo bạo

Văn bản này là in nghiêng

Đây là chỉ số và superscript

Hãy tự mình thử »


Các yếu tố định dạng HTML

Các yếu tố định dạng được thiết kế để hiển thị các loại văn bản đặc biệt:

  • This is a heading element

    2 - Văn bản táo bạo
  • This is a heading element

    3 - Văn bản quan trọng
  • This is a heading element

    4 - văn bản in nghiêng
  • This is a heading element

    5 - Văn bản nhấn mạnh
  • This is a heading element

    6 - văn bản được đánh dấu
  • This is a heading element

    7 - Văn bản nhỏ hơn
  • This is a heading element

    8 - văn bản đã xóa
  • This is a heading element

    9 - Văn bản được chèn
  • This is the biggest one

    This one is a little smaller

    This one is even smaller

    They keep getting smaller

    This one isn't even that big
    Pretty small now, actually
    0 - Văn bản đăng ký
  • This is the biggest one

    This one is a little smaller

    This one is even smaller

    They keep getting smaller

    This one isn't even that big
    Pretty small now, actually
    1 - Văn bản SuperScript

HTML và các yếu tố

Phần tử HTML

This is a heading element

2 xác định văn bản in đậm, mà không có bất kỳ tầm quan trọng nào.

Phần tử HTML

This is a heading element

3 xác định văn bản có tầm quan trọng mạnh mẽ. Nội dung bên trong thường được hiển thị in đậm.



HTML và các yếu tố

Phần tử HTML

This is a heading element

2 xác định văn bản in đậm, mà không có bất kỳ tầm quan trọng nào.

Phần tử HTML

This is a heading element

3 xác định văn bản có tầm quan trọng mạnh mẽ. Nội dung bên trong thường được hiển thị in đậm. The

This is a heading element

4 tag is often used to indicate a technical term, a phrase from another language, a thought, a ship name, etc.

Phần tử HTML

This is a heading element

4 xác định một phần của văn bản trong một giọng nói hoặc tâm trạng thay thế. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Thẻ

This is a heading element

4 thường được sử dụng để chỉ ra một thuật ngữ kỹ thuật, một cụm từ từ ngôn ngữ khác, một suy nghĩ, tên tàu, v.v. A screen reader will pronounce the words in

This is a heading element

5 with an emphasis, using verbal stress.


Phần tử HTML

This is a heading element

5 xác định văn bản nhấn mạnh. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Một đầu đọc màn hình sẽ phát âm các từ trong

This is a heading element

5 với sự nhấn mạnh, sử dụng căng thẳng bằng lời nói.


Phần tử HTML

This is a heading element

5 xác định văn bản nhấn mạnh. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Một đầu đọc màn hình sẽ phát âm các từ trong

This is a heading element

5 với sự nhấn mạnh, sử dụng căng thẳng bằng lời nói.


Phần tử HTML

This is a heading element

5 xác định văn bản nhấn mạnh. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Một đầu đọc màn hình sẽ phát âm các từ trong

This is a heading element

5 với sự nhấn mạnh, sử dụng căng thẳng bằng lời nói.


Phần tử HTML

This is a heading element

5 xác định văn bản nhấn mạnh. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Một đầu đọc màn hình sẽ phát âm các từ trong

This is a heading element

5 với sự nhấn mạnh, sử dụng căng thẳng bằng lời nói.

Thí dụ

Phần tử HTML

Hãy tự mình thử »


Phần tử HTML

This is a heading element

5 xác định văn bản nhấn mạnh. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Một đầu đọc màn hình sẽ phát âm các từ trong

This is a heading element

5 với sự nhấn mạnh, sử dụng căng thẳng bằng lời nói.


Phần tử HTML

This is a heading element

5 xác định văn bản nhấn mạnh. Nội dung bên trong thường được hiển thị bằng chữ in nghiêng.

Mẹo: Một đầu đọc màn hình sẽ phát âm các từ trong

This is a heading element

5 với sự nhấn mạnh, sử dụng căng thẳng bằng lời nói.


Phần tử HTML


Phần tử HTML

This is a heading element

7 xác định văn bản nhỏ hơn:
Phần tử HTML

This is a heading element

6 xác định văn bản nên được đánh dấu hoặc tô sáng:
Phần tử HTML

This is a heading element

8 xác định văn bản đã bị xóa khỏi tài liệu. Trình duyệt thường sẽ tấn công một dòng thông qua văn bản đã xóa:
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.
Phần tử HTML

This is a heading element

9 xác định một văn bản đã được chèn vào một tài liệu. Trình duyệt thường sẽ gạch chân văn bản chèn:
Màu sắc yêu thích của tôi là màu xanh lam.

Phần tử HTML

This is the biggest one

This one is a little smaller

This one is even smaller

They keep getting smaller

This one isn't even that big
Pretty small now, actually
0 xác định văn bản đăng ký. Văn bản đăng ký xuất hiện một nửa ký tự bên dưới dòng thông thường và đôi khi được hiển thị trong một phông chữ nhỏ hơn. Văn bản đăng ký có thể được sử dụng cho các công thức hóa học, như H2O:



Bài 3: Các yếu tố văn bản trong HTML

/en/basic-html/create-a-webpage/content/

Thêm các phần tử văn bản trong HTML

Bài học này là một phần & nbsp; của một loạt trên & nbsp; lập trình máy tính. Bạn có thể truy cập & nbsp; giới thiệu để lập trình & nbsp; nếu bạn muốn bắt đầu ngay từ đầu.computer programming. You can go to Intro to Programming if you'd like to start at the beginning.

Một số yếu tố HTML phổ biến nhất tạo nên một trang web là các yếu tố văn bản. Tất cả các văn bản bạn đọc trên trang web này, ví dụ, cho dù đó là các tiêu đề ở đầu trang, phần tiêu đề hoặc chính văn bản này, được tạo từ các phần tử văn bản HTML.text elements. All the text you read on this website, for example, whether it's the titles at the top of the page, the section headers, or this very text, is made from HTML text elements.

Hướng dẫn how do you display text in html? - làm thế nào để bạn hiển thị văn bản trong html?

Yếu tố đoạn văn

Cách cơ bản nhất để thêm văn bản vào một trang web là phần tử đoạn văn. Nếu bạn đã theo dõi cùng với hướng dẫn này, bạn đã thấy yếu tố này trước đây, nhưng nó đáng để lặp lại, bởi vì phần tử đoạn văn là một trong những yếu tố HTML phổ biến nhất được sử dụng trên hầu hết các trang web bạn truy cập mỗi ngày. & NBSP;paragraph element. If you've been following along with this tutorial, you've seen this element before, but it's worth repeating, because the paragraph element is one of the most common HTML elements used on most of the websites you visit every day. 

This is a paragraph

Theo mặc định, mọi trình duyệt đều đặt một chút không gian trên và bên dưới các phần tử đoạn văn khi chúng hiển thị chúng, giữ cho mỗi đoạn độc lập với các phần xung quanh nó, giống như các đoạn văn bạn thấy được in trong một cuốn sách hoặc tạp chí. & NBSP;a bit of space above and below paragraph elements when they display them, which keeps each paragraph independent from the ones around it, just like the paragraphs you'd see printed in a book or magazine. 

Các yếu tố tiêu đề

Giống như phần tử đoạn văn, các phần tử tiêu đề cũng được sử dụng để hiển thị văn bản trên màn hình. Chúng thường được sử dụng để tạo các tiêu đề phần. & NBSP;heading elements are also used to display text on the screen. They're generally used to create section headings

This is a heading element

Ví dụ: bạn có thể sử dụng một yếu tố tiêu đề để hiển thị tiêu đề của một bài luận bạn đang viết hoặc tên của một chương trong một cuốn sách. Văn bản thực tế của bài luận hoặc chương, mặt khác, sẽ sử dụng các yếu tố đoạn văn.

Hướng dẫn how do you display text in html? - làm thế nào để bạn hiển thị văn bản trong html?

Các yếu tố tiêu đề có sáu cấp mặc định,

These words aren't bold, but these two are.

4 đến

These words aren't bold, but these two are.

5, mà bạn có thể nghĩ là một thứ tự quan trọng. Ví dụ, nếu bạn đặt một

These words aren't bold, but these two are.

4 trên trang web của mình, thật an toàn khi cho rằng đó là phần tiêu đề phần quan trọng nhất và có thể ở đầu trang của bạn, trong khi

These words aren't bold, but these two are.

4 ít hơn và quan trọng một chút, v.v. & NBSP;six default levels,

These words aren't bold, but these two are.

4 through

These words aren't bold, but these two are.

5, which you can think of as an order of importance. If you put an

These words aren't bold, but these two are.

4 on your web page, for example, it's safe to assume that it's the most important section heading and probably at the top of your page, while an

These words aren't bold, but these two are.

4 is slightly less and important, and so on. 

Chúng cũng đi kèm với một số kiểu dáng của trình duyệt mặc định, điều này củng cố thứ tự quan trọng đó: yếu tố

These words aren't bold, but these two are.

4 là lớn nhất,

These words aren't bold, but these two are.

4 nhỏ hơn và như vậy.default browser styling, which reinforces that order of importance: the

These words aren't bold, but these two are.

4 element is the biggest, the

These words aren't bold, but these two are.

4 is smaller, and on like that.

This is the biggest one

This one is a little smaller

This one is even smaller

They keep getting smaller

This one isn't even that big
Pretty small now, actually

Các yếu tố định dạng văn bản

Các yếu tố định dạng văn bản được sử dụng để thay đổi cách văn bản nhìn theo những cách được xác định trước. Chẳng hạn, đây là một vài yếu tố định dạng văn bản phổ biến:change the way text looks in certain predefined ways. For instance, here are a few common text formatting elements:

  • Bold: Phần tử ____ 12 & nbsp; làm cho nội dung của nó in đậm.old: The

    This is a heading element

    2 element makes its contents bold.
  • Italics: Phần tử

    This is a heading element

    4 in nghiêng nội dung của nó. & NBSP;
    : The

    This is a heading element

    4 element italicizes its contents. 
  • Gạch chân: Phần tử

    The Long Goodnight

    Chapter 1: The City and the Silence

    Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

    I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

    2 nhấn mạnh nội dung của nó.
    : The

    The Long Goodnight

    Chapter 1: The City and the Silence

    Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

    I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

    2 element underlines its contents.

Các yếu tố này thường được tìm thấy được lồng bên trong các yếu tố văn bản khác, chẳng hạn như đoạn văn hoặc các phần tử tiêu đề, bởi vì chúng thường chỉ có nghĩa là áp dụng cho một phần của văn bản. Ví dụ:nested inside of other text elements, such as the paragraph or heading elements, because they are usually only meant to apply to part of the text. For example:

These words aren't bold, but these two are.

HTML sẽ được hiển thị như thế này:

Hướng dẫn how do you display text in html? - làm thế nào để bạn hiển thị văn bản trong html?

Thử cái này!

Hãy thử thử nghiệm từng yếu tố được đề cập trong bài học này & nbsp; trong đầu vào bên dưới. Bạn có thể nhập bất cứ điều gì bạn muốn, nhưng nếu & nbsp; bạn cần một số ý tưởng trên & nbsp; những gì cần nhập, hãy thử sử dụng các yếu tố bên dưới làm ví dụ.experimenting with each of the elements covered in this lesson in the input below. You can enter whatever you want, but if you need some ideas on what to enter, try using the elements below as an example.

The Long Goodnight

Chapter 1: The City and the Silence

Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

Nhập các phần tử HTML của bạn vào đầu vào tại đây:

Tự làm!

Mở tệp & nbsp; index.html & nbsp; tệp & nbsp; hướng dẫn lập trình gcf của bạn & nbsp; dự án trong trình soạn thảo văn bản của bạn và hãy thêm một số & nbsp; các yếu tố văn bản. Để hiểu rõ nhất, hãy chắc chắn & nbsp; thực sự nhập mã này, thay vì sao chép và dán nó. & Nbsp;index.html file of your GCF Programming Tutorials project in your text editor, and let's add some text elements. For the best understanding, be sure to actually type this code in, rather than copying and pasting it. 

  1. Khi bạn lần đầu tiên tạo tệp này, bạn đã có một yếu tố nội dung thực tế trên trang. Đầu tiên, tìm phần tử đó:

    Hello, world!

  2. Đi trước và & nbsp; xóa phần tử đó. & Nbsp;delete that element
  3. Thay vào đó, hãy bắt đầu tạo ra một cái gì đó giống như một trang web thực sự mà bạn thực sự có thể thấy trong cuộc sống thường xuyên: & nbsp; một trang web đánh giá phim. của bạnmovie review webpage. Start with a heading, and make sure to put it inside the 

    The Long Goodnight

    Chapter 1: The City and the Silence

    Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

    I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

    3 element, where your 

    The Long Goodnight

    Chapter 1: The City and the Silence

    Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

    I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

    4element was before: 

    Cinema Classics Movie Reviews

  4. Ngay bên dưới đó, hãy thêm A & NBSP; Tiêu đề phụ. Mặc dù tiêu đề đầu tiên là tiêu đề chính & nbsp; của toàn bộ trang web của bạn, nhưng đây sẽ chỉ là tiêu đề cho đánh giá của bạn về một bộ phim bom tấn tạo thành hit: & nbsp; ________ 7sub-heading. While the first heading was the main heading of your whole webpage, this one will just be the title for your review of a made-up blockbuster hit: 

    Review: Basketball Dog (2018)

  5. Bây giờ chúng ta hãy thêm một số & nbsp; văn bản. Đây là phần thịt thực sự của đánh giá của bạn, vì vậy có nhiều từ hơn, nhưng lưu ý rằng chúng vẫn chỉ được gói trong các thẻ đơn giản & nbsp; ____ 44 & nbsp; Bạn vừa thêm vào:

    4 out of 5 stars

    From director Vicki Fleming comes the heartwarming tale of a boy named Pete (Trent Dugson) and his dog Rover (voiced by Brinson Lumblebrunt). You may think a boy and his dog learning the true value of friendship sounds familiar, but a big twist sets this flick apart: Rover plays basketball, and he's doggone good at it.

    While it may not have been necessary to include all 150 minutes of Rover's championship game in real time, Basketball Dog will keep your interest for the entirety of its 4-hour runtime, and the end will have any dog lover in tears. If you love basketball or sports pets, this is the movie for you.

    Find the full cast listing at the Basketball Dog website.

    text. This is the real meat of your review, so there are a lot more words, but notice that they're still just wrapped in simple 

    The Long Goodnight

    Chapter 1: The City and the Silence

    Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

    I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

    4 tags, one for each separate paragraph. Add this just below the 

    These words aren't bold, but these two are.

    4 element you just added:

    4 out of 5 stars

    From director Vicki Fleming comes the heartwarming tale of a boy named Pete (Trent Dugson) and his dog Rover (voiced by Brinson Lumblebrunt). You may think a boy and his dog learning the true value of friendship sounds familiar, but a big twist sets this flick apart: Rover plays basketball, and he's doggone good at it.

    While it may not have been necessary to include all 150 minutes of Rover's championship game in real time, Basketball Dog will keep your interest for the entirety of its 4-hour runtime, and the end will have any dog lover in tears. If you love basketball or sports pets, this is the movie for you.

    Find the full cast listing at the Basketball Dog website.

  6. Cho rằng cô ấy là đạo diễn & nbsp; của bộ phim, có vẻ như "Vicki Fleming" có thể là cái tên quan trọng nhất trong các đoạn đó, vì vậy hãy làm cho nó & nbsp; Bold & nbsp; để thu hút sự chú ý nhiều hơn đến nó. Chỉ bao bọc tên đó với & nbsp; ________ 12 & nbsp; và & nbsp;bold to attract more attention to it. Wrap just that name with 

    This is a heading element

    2 and 

    The Long Goodnight

    Chapter 1: The City and the Silence

    Detective Hardcastle shuddered when he heard the knock at his door. Midnight on a Saturday, and somebody was looking for a gumshoe? It smelled like trouble, because if he had learned one thing in his time as a private eye, it was that all the city's ghosts came out at night.

    I hope you're not looking for a fight, he thought to himself. Because if you are, you found it.

    8 tags, like so: 
    Vicki Fleming
  7. Nó cũng có thể là một ý tưởng tốt để đặt xếp hạng ngôi sao khác biệt với phần còn lại của văn bản. Hãy in nghiêng điều đó để tách nó ra. Chỉ bao bọc những từ đó với các thẻ

    This is a heading element

    4 và

    Hello, world!

    0, như vậy: ________ 10italicize that to separate it. Wrap just those words with

    This is a heading element

    4 and

    Hello, world!

    0 tags, like so:

    This is a heading element

    0

Khi bạn đã hoàn thành tất cả những điều này, mã hoàn chỉnh của bạn sẽ trông như thế này:

This is a heading element

1

Bấm đúp vào tệp & nbsp; index.html & nbsp; tệp để tải nó trong trình duyệt và bạn sẽ thấy điều này. & Nbsp; trang web của bạn bắt đầu trông giống một trang web thực tế hơn một chút!index.html file to load it in the browser, and you should see this. Your webpage is starting to look a little more like an actual webpage!

/en/basic-html/lists-in-html/content/