设置导航链接背景和单击区域
实例代码:
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <style>
6 ul{
7 list-style-type:none;
8 margin:0;
9 padding:0;
10 }
11 li a {
12 display:block; /*所有区域都可以单击。*/
13 background-color:#dddddd;
14 width:60px;
15
16 }
17 </style>
18 </head>
19 <body>
20
21 <ul>
22 <li><a href="https://www.dwoke.com">首页</a></li>
23 <li><a href="https://www.dwoke.com">文章</a></li>
24 <li><a href="https://www.dwoke.com">下载</a></li>
25 <li><a href="https://www.dwoke.com">文档</a></li>
26 <li><a href="https://www.dwoke.com">关于</a></li>
27
28 <p>背景色被添加到链接以显示链接区域。 </p>
29 <p>请注意,整个链接区域都是可以单击的,而不仅仅是文本。 </p>
30 </ul>
31
32 </body>
33
34 </html>
运行效果:
评论