Home >Web Front-end >HTML Tutorial >Use div css to create simple navigation and issues to pay attention to_html/css_WEB-ITnose
Use div css to create simple navigation and issues to pay attention to_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:26:58961browse
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 5 6 <style type="text/css"> 7 8 9 #headNav {10 width:960px;11 height:30px;12 line-height:30px;13 background-color: lightblue;14 margin:0 auto;15 }16 17 #headNav ul {18 list-style:none;19 }20 21 #headNav ul li {22 float:left;23 height: 30px;24 line-height: 30px; 25 padding:0 10px;26 }27 28 #headNav ul li:hover {29 background-color: white;30 }31 32 a {33 color:red;34 text-decoration:none;35 }36 37 a:hover {38 39 }40 </style>41 42 </head>43 <body>44 <div id="headNav">45 <ul>46 <li><a href="#">首页</a></li>47 <li><a href="#">网页版式布局</a></li>48 <li><a href="#">div+css教程</a></li>49 <li><a href="#">div+css实例</a></li>50 <li><a href="#">常用代码</a></li>51 </ul>52 </div>53 </body>54 </html> Note:
① Line 12 is the height of the navigation div to be set
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn