Cách Sử Dụng Thẻ Nav để Tạo Thanh Menu Trong HTML - Web Cơ Bản

Trang chủ » Thẻ Nav Trong Html Là Gì » Cách Sử Dụng Thẻ Nav để Tạo Thanh Menu Trong HTML - Web Cơ Bản

Có thể bạn quan tâm

Thẻ <nav> trong HTML

1) Thẻ <nav> trong HTML

- Thẻ <nav> dùng để xác định "một tập hợp các liên kết"

(những liên kết này thường là những liên kết chính và quan trọng trong trang web)

Ví dụ: <nav> <a href="http://webcoban.vn/html">HTML</a> | <a href="http://webcoban.vn/css">CSS</a> | <a href="http://webcoban.vn/javascript">JavaScript</a> | <a href="http://webcoban.vn/mysql">MySQL</a> | <a href="http://webcoban.vn/php">PHP</a> </nav>

Khi đó, màn hình trình duyệt sẽ hiển thị:

HTML | CSS | JavaScript | MySQL | PHP Xem ví dụ

- Ngoài ra, thẻ <nav> thường được sử dụng kết hợp với CSS để định dạng thành một "thanh menu".

Ví dụ: <!DOCTYPE html> <html> <head> <style type="text/css"> nav{ background-color:#47bdec; } nav a{ display:inline-block; padding:10px; font-size:20px; color:white; text-decoration:none; } nav a:hover{ background-color:#333; } </style> </head> <body> <nav> <a href="http://webcoban.vn/html/default.html">HTML</a> <a href="http://webcoban.vn/css/default.html">CSS</a> <a href="http://webcoban.vn/javascript/default.html">JavaScript</a> <a href="http://webcoban.vn/mysql/default.html">MySQL</a> <a href="http://webcoban.vn/php/default.html">PHP</a> </nav> </body> </html>

Khi đó, màn hình trình duyệt sẽ hiển thị:

HTML CSS JavaScript MySQL PHP Xem ví dụ

2) Định dạng CSS mặc định

- Hầu hết các trình duyệt sẽ hiển thị phần tử <nav> với định dạng CSS như sau:

nav { display: block; }

Từ khóa » Thẻ Nav Trong Html Là Gì