标签：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 <link rel="stylesheet" href="reset.css"/> 7 <style> 8 .hotsearch dd{ 9 float: left; 10 line-height: 24px; 11 margin-right: 30px; 12 overflow: hidden; 13 text-align: center; 14 width: 4em; /*这个值是看最长能显示几个文字，如x，则为x em*/ 15 } 16 .hotsearch dd a{ 17 display:block; 18 } 19 .w2{ 20 letter-spacing:2em; /*如果需要y个字两端对齐，则为(x-y)/(y-1),这里是（4-2）/(2-1)=2em */ 21 margin-right:-2em; /*同上*/ 22 } 23 .w3{ 24 letter-spacing:0.5em; /*如果需要y个字两端对齐，则为(x-y)/(y-1),这里是（4-3）/(3-1)=0.5em */ 25 margin-right:-0.5em; /*同上*/ 26 } 27 </style> 28 </head> 29 <body> 30 <dl class="hotsearch" style="width:300px;"> 31 <dt>热门搜索</dt> 32 <dd><a href="#" target="_blank" ref="nav" class="w3">电视机</a></dd> 33 <dd><a href="#" target="_blank" ref="nav" class="w4">性感漂亮</a></dd> 34 <dd><a href="#" target="_blank" ref="nav" class="w3">高跟鞋</a></dd> 35 <dd><a href="#" target="_blank" ref="nav" class="w2">手机</a></dd> 36 <dd><a href="#" target="_blank" ref="nav" class="w2">对齐</a></dd> 37 <dd><a href="#" target="_blank" ref="nav" class="w3">牛仔裤</a></dd> 38 <dd><a href="#" target="_blank" ref="nav" class="w4">小家碧玉</a></dd> 39 <dd><a href="#" target="_blank" ref="nav" class="w2">家居</a></dd> 40 </dl> 41 </body> 42 </html>
标签：
原文地址：http://www.cnblogs.com/qianduanjingying/p/5227576.html
