Web Cơ Bản

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ị:

- 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ị:

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;
}