首页html网页上部导航栏

html网页上部导航栏

时间: 2023-11-17 11:06:03 浏览: 95

以下是一个简单的HTML网页上部导航栏的例子： ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>网页标题</title> <style> /* 导航栏样式 */ nav { background-color: #333; /* 背景颜色 */ overflow: hidden; /* 隐藏溢出部分 */ } /* 导航栏链接样式 */ nav a { float: left; /* 左浮动 */ color: white; /* 字体颜色 */ text-align: center; /* 文本居中 */ padding: 14px 16px; /* 内边距 */ text-decoration: none; /* 去除下划线 */ } /* 鼠标悬停链接样式 */ nav a:hover { background-color: #ddd; /* 背景颜色 */ color: black; /* 字体颜色 */ } </style> </head> <body>  <nav> <a href="#">链接1</a> <a href="#">链接2</a> <a href="#">链接3</a> <a href="#">链接4</a> </nav>  <h1>网页标题</h1> <p>这里是网页内容。</p> </body> </html> ```

阅读全文