Kiến thức tổng hợp

Các thẻ cơ bản trong HTML – Cùng học HTML

Nối tiếp với nội dung ở bài 1 giới thiệu về HTML là gì thì bài này sẽ giới thiệu với các bạn các thẻ cơ bản khi học HTML.

các thẻ cơ bản html
Các thẻ HTML cơ bản.

Thẻ heading trong HTML

Bất kỳ tài liệu nào cũng bắt đầu bằng một tiêu đề. Bạn có thể sử dụng các kích thước khác nhau cho các tiêu đề của mình. HTML cũng có 6 cấp độ tiêu đề, sử dụng các phần tử <h1>, <h2>, <h3>, <h4>, <h5> và <h6>. Cách hiển thị sẽ chèn cặp thẻ đằng trước và sau 1 đoạn tiêu đề.

Ví dụ:

<!DOCTYPE html>
<html>

   <head>
      <title>Trợ Giúp Nhanh</title>
   </head>
	
   <body>
      <h1>Đây là tiêu đề 1</h1>
      <h2>Đây là tiêu đề 2</h2>
      <h3>Đây là tiêu đề 3</h3>
      <h4>Đây là tiêu đề 4</h4>
      <h5>Đây là tiêu đề 5</h5>
      <h6>Đây là tiêu đề 6</h6>
   </body>
	
</html>

Kết quả hiện thị sẽ như sau, số thẻ càng lớn thì chữ càng nhỏ.

Thẻ Paragraph trong HTML ( Thẻ văn bản)

Thẻ <p> cung cấp một cách để cấu trúc văn bản của bạn thành các đoạn văn khác nhau. Mỗi đoạn văn bản phải nằm giữa thẻ <p> mở và thẻ đóng </p>.

Ví dụ:

<!DOCTYPE html>
<html>

   <head>
      <title>Paragraph Example</title>
   </head>
	
   <body>
      <p>Đây là một đoạn văn bản đầu tiên..</p>
      <p>Đây là một đoạn văn bản thứ hai.</p>
      <p>Đây là một đoạn văn bản thứ ba.</p>
   </body>
	
</html>

Kết quả sẽ hiển thị như sau :

Thẻ Line Break ( Thẻ xuống dòng)

Sử dụng thẻ này không cần kết hợp thẻ mở và thẻ đóng. Mục đích của thẻ này giúp bạn xuống dòng 1 đoạn văn bản.

<body>
      <p>Xin chào<br />
         Chào mừng bạn đến với Trợ Giúp Nhanh.<br />
         Xin cảm ơn<br />
   </body>

Kết quả sẽ như sau :

Có thể bạn cần →   HTML là gì ? Tổng quan về HTML

Xin chào
Chào mừng bạn đến với Trợ Giúp Nhanh
Xin cảm ơn

Thẻ căn giữa nội dụng (Center)

Thẻ này để căn chỉnh nội dung về giữa trang web hoặc giữa khung của một bố cục đã được cố định.

<!DOCTYPE html>
<html>

   <head>
      <title>Trợ Giúp Nhanh</title>
   </head>
	
   <body>
      <p>Dòng này không căn giữa.</p>
      
      <center>
         <p>Dòng này căn giữa.</p>
      </center>
   </body>
	
</html>

Kết quả sẽ hiển thị như sau :

Dòng này không căn giữa
Dòng này căn giữa

Thẻ tạo phân chia bố cục tài liệu

Các đường ngang được sử dụng để chia nhỏ các phần của tài liệu một cách trực quan. Thẻ <hr> tạo một dòng từ vị trí hiện tại trong tài liệu sang lề phải và ngắt dòng tương ứng.

Ví dụ: Bạn có thể muốn đặt một dòng giữa hai đoạn văn như trong ví dụ dưới đây

<!DOCTYPE html>
<html>

   <head>
      <title>Horizontal Line Example</title>
   </head>
	
   <body>
      <p>Đây là đoạn một và phải ở trên cùng</p>
      <hr />
      <p>Đây là đoạn hai và phải ở dưới cùng</p>
   </body>
	
</html>

Kết quả

Thẻ <hr /> không cần thẻ mở và thẻ đóng, vì không có gì để xen vào giữa.

Kết luận

Trên đây là một số thẻ cơ bản bạn sẽ thường dùng để tạo bố cục đẹp mắt cho văn bản sử dụng HTML. Hy vọng bài viết sẽ hữu ích với các bạn.

Trợ Giúp Nhanh

Tùng Lâm

Xin chào, mình là Lâm. Hiện tại mình đang là Network Engineer / Security Engineer. TGN là nơi mình viết bài khi có những thời gian rảnh rỗi.

Bài viết liên quan

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
Back to top button
0
Would love your thoughts, please comment.x
()
x