跑步 ”
×
改变方向
在 Codepen 上打开
更改主题，深色/浅色
<!DOCTYPE html> <html> <head><meta http-equiv="content-security-policy" content="script-src 'none'"> <style> .nav { background-color: yellow; list-style-type: none; text-align: center; margin: 0; padding: 0; } .nav li { display: inline-block; font-size: 20px; padding: 20px; } </style> </head> <body> <h1>Горизонтальные навигационные ссылки</h1> <p>По умолчанию элементы списка отображаются вертикально. В этом примере мы используем display: inline-block, чтобы отображать их по горизонтали (друг за другом).</p> <p>Примечание: Если вы измените размер окна браузера, ссылки автоматически разорвутся, когда в нём станет слишком тесно.</p> <ul class="nav"> <li><a href="#home">Главная</a></li> <li><a href="#about">Про нас</a></li> <li><a href="#clients">Наши клиенты</a></li> <li><a href="#contact">Контакты</a></li> </ul> </body> </html>
