简单的菜单栏
查询CSS样式：http://www.w3school.com.cn
margin设置外边距
display按行显示
padding设置内边距
padding-right字体内部间隔
background-color背景颜色
id选择器前面是一个#号
class选择器前面是一个.
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>菜单栏</title> 6 <!-- 7 margin设置外边距 8 display按行显示 9 padding设置内边距 10 padding-right字体内部间隔 11 background-color背景颜色 12 id选择器前面是一个#号 13 class选择器前面是一个. 14 --> 15 <style type="text/css"> 16 body{ 17 margin:0px; 18 } 19 20 li{ 21 color:#fff; 22 display:inline; 23 padding-right:20px; 24 } 25 26 .nav{ 27 padding-top:15px; 28 padding-bottom:15px; 29 background-color:#333; 30 } 31 32 </style> 33 </head> 34 <body> 35 <div class="nav"> 36 <ul> 37 <li>Java</li> 38 <li>CSS</li> 39 <li>HTML</li> 40 <li>JavaScript</li> 41 <li>jQeury</li> 42 </ul> 43 </div> 44 </body> 45 </html>
