Menu
GIỚI THIỆU
  • Bài học này chúng ta học về định dạng heading và list bằng các thẻ trong HTML, một số cách vận dụng thẻ h1 đến h6 và các thẻ ul li để tạo bổ cục layout html.

Bài 04: Định dạng heading và HTML List

Bài học này chúng ta học về định dạng heading và list bằng các thẻ trong HTML, một số cách vận dụng thẻ h1 đến h6 và các thẻ ul li để tạo bổ cục layout html. Việc sử dụng các định dạng này không những thân thiện với người dùng mà nó còn có tác dụng khá tốt trong việc SEO website.

1.Thẻ định dạng tiêu đề trong HTML 

Thẻ định dạng Heading hay tiêu đề được định dạng bằng các thẻ <h1> đến <h6>.

<H1> Được sử dụng xác định tiêu đề quan trọng nhất. <H6> xác định tiêu đề ít quan trọng nhất.

<h1>Tiêu đề H1</h1>
<h2>Tiêu đề H2</h2>
<h3>Tiêu đề H3</h3>
<h4>Tiêu đề H4</h4>
<h5>Tiêu đề H5</h5>
<h6>Tiêu đề H6</h6>

Lưu ý: Các trình duyệt sẽ tự động thêm một khoảng trắng giữa lề trước và sau tiêu đề.

2.HTML List

Một danh sách không có thứ tự bắt đầu bằng thẻ <ul> . Mỗi mục trong danh sách bắt đầu bằng thẻ <li> .

Danh sách các mục sẽ được đánh dấu bằng dấu đầu dòng () theo mặc định:

<ul>
  <li>hoicode.com</li>
  <li>hoicode.com</li>
  <li>hoicode.com</li>
</ul>

3.Danh sách HTML không theo thứ tự 

Thuộc tính kiểu danh sách CSS được sử dụng để xác định kiểu của điểm đánh dấu danh mục:

#Disc

<ul style="list-style-type:disc">
  <li>hoicode.com</li>
  <li>hoicode.com</li>
  <li>hoicode.com</li>
</ul>

#Circle

<ul style="list-style-type:circle">
  <li>hoicode.com</li>
  <li>hoicode.com</li>
  <li>hoicode.com</li>
</ul>

#Square

<ul style="list-style-type:square">
  <li>hoicode.com</li>
  <li>hoicode.com</li>
  <li>hoicode.com</li>
</ul>

#None

<ul style="list-style-type:none">
  <li>hoicode.com</li>
  <li>hoicode.com</li>
  <li>hoicode.com</li>
</ul>

4.Kết thúc bài học 04 HTML Basic

Thông thường chúng ta hay sử dụng thẻ ulli để xây dựng menu đa cấp, menu dọc và menu ngang đều được. Tuy nhiên để làm được điều đó thì ban phải kết hợp với CSS, vì vậy sau khi học xong hai phần HTML và CSS thì chúng ta sẽ làm các ví dụ thực tế đó. Bài tiếp theo chúng ta học về Định dạng Table với các thẻ trong HTML.

Ghi nguồn hoicode.com khi đăng tải lại bài viết này.
Link: Bài 04: Định dạng heading và HTML List
Tags: heading list html css
Category: HTML cơ bản
Mạnh xã hội: Follow fanpage của team https://www.facebook.com/hoicode/ để tiếp tục theo dõi các loạt bài mới nhất về HTML cơ bản,Java,C,C++,Javascript,HTML,PHP,Python,Database,Mobile.... mới nhất của chúng tôi.

Chia sẻ liên kết

ĐĂNG BÌNH LUẬN: Đăng câu hỏi trên Facebook để được hỗ trợ nhanh nhất.

    Email của bạn sẽ được sử dụng với mục đích thông báo tin tuyển dụng mới hoặc các bài viết mới.

    captcha