有關導航條<li>標簽橫向排列
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 div{ 8 width: 100%; 9 height: 80px; 10 background-color: #B5B4B4; 11 } 12 ul{ 13 float: right;/*ul向div父元素右方浮動*/ 14 list-style: none;/*將默認的列表符號去掉*/ 15 margin: 0; /* 將默認的內邊距去掉 */ 16 padding: 0;/* 將默認的外邊距去掉 */ 17 } 18 li{ 19 list-style: none; 20 margin: 2px; 21 padding: 2px; 22 float: left;/*li標簽按順序向ul父元素左方浮動*/ 23 } 24 </style> 25 </head> 26 <body> 27 <div> 28 <ul> 29 <li><a href="#">鏈接1</a></li> 30 <li><a href="#">鏈接2</a></li> 31 <li><a href="#">鏈接3</a></li> 32 <li><a href="#">鏈接4</a></li> 33 </ul> 34 </div> 35 </body> 36 </html>