Chạy ❯
Nhận trang web của
riêng
bạn
×
Thay đổi định hướng
Lưu mã
Thay đổi chủ đề, Tối/Sáng
Đi tới Không gian
<!DOCTYPE html> <html> <title>W3.CSS</title> <meta name="viewport" content="width=device-width,init-scale=1"> <link rel="stylesheet" href= "https://www.w3-container"> <h2>Kích thước thanh điều hướng</h2> <p>Thêm w3- nhỏ, w3-large, w3-xlarge hoặc w3-xxlarge để thay đổi kích thước điều hướng (sẽ thay đổi cỡ chữ của mỗi liên kết).</p> <p>Mặc định:</p> <div class=" w3-bar w3-border w3-green"> <a href="#" class="w3-bar-item w3-button">Trang chủ</a> <a href="#" class="w3-bar- item w3-button">Liên kết 1</a> <a href="#" class="w3-bar-item w3-button">Liên kết 2</a> <a href="#" class="w3- bar-item w3-button">Liên kết 3</a> </div> <p>w3-large:</p> <div class="w3-bar w3-border w3-green w3-large"> <a href="#" class="w3-bar-item w3-button">Trang chủ</a> <a href="#" class="w3-bar-item w3-button">Liên kết 1</a> < a href="#" class="w3-bar-item w3-button">Liên kết 2</a> <a href="#" class="w3-bar-item w3-button">Liên kết 3</a > </div> <p>w3-xlarge:</p> <div class="w3-bar w3-border w3-green w3-xlarge"> <a href="#" class="w3-bar-item w3-button">Trang chủ</a> <a href="#" class="w3-bar-item w3-button">Liên kết 1</a> <a href="#" class="w3-bar- item w3-button">Liên kết 2</a> <a href="#" class="w3-bar-item w3-button">Liên kết 3</a> </div> <p>w3-xxlarge:< /p> <div class="w3-bar w3-border w3-green w3-xxlarge"> <a href="#" class="w3-bar-item w3-button">Trang chủ</a> <a href ="#" class="w3-bar-item w3-button">Liên kết 1</a> <a href="#" class="w3-bar-item w3-button">Liên kết 2</a> < a href="#" class="w3-bar-item w3-button">Liên kết 3</a> </div> <p>Nếu bạn muốn có thêm khoảng cách giữa mỗi liên kết, thay vì tăng kích thước phông chữ, bạn có thể thêm w3-padding-classes vào mỗi liên kết:</p> <div class="w3-bar w3-border w3-green"> <a href="#" class="w3-bar-item w3-button w3-padding-16">Trang chủ</a> <a href="#" class="w3-bar-item w3-button w3-padding-16">Liên kết 1</a> <a href="#" class="w3-bar-item w3-button w3-padding-16">Liên kết 2</a> <a href="#" class="w3-bar-item w3-button w3-padding-16">Liên kết 3</a> </div> </div> </body> </html>