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>
时间： 2024-08-24 01:35:51