zoukankan      html  css  js  c++  java
  • HTML + CSS短标题(二,三,四文字长度)两端对齐的方式

    1. <style type="text/css">  
    2. .hotsearch dd{  
    3. float: left;  
    4. line-height: 24px;  
    5. margin-right: 30px;  
    6. overflow: hidden;  
    7. text-align: center;  
    8.  4em; /*这个值是看最长能显示几个文字,如x,则为x em*/  
    9. }  
    10. .hotsearch dd a{  
    11. display:block;  
    12. }  
    13. .w2{  
    14. letter-spacing:2em; /*如果需要y个字两端对齐,则为(x-y)/(y-1),这里是(4-2)/(2-1)=2em */  
    15. margin-right:-2em; /*同上*/  
    16. }  
    17. .w3{  
    18. letter-spacing:0.5em; /*如果需要y个字两端对齐,则为(x-y)/(y-1),这里是(4-3)/(3-1)=0.5em */  
    19. margin-right:-0.5em; /*同上*/  
    20. }  
    21. </style>  
    1. <span style="font-size:12px;"><dl class="hotsearch" style="300px;">  
    2. <dt>热门搜索</dt>  
    3. <dd><href="#" target="_blank" ref="nav" class="w3">电视机</a></dd>  
    4. <dd><href="#" target="_blank" ref="nav" class="w4">性感漂亮</a></dd>  
    5. <dd><href="#" target="_blank" ref="nav" class="w3">高跟鞋</a></dd>  
    6. <dd><href="#" target="_blank" ref="nav" class="w2">手机</a></dd>  
    7. <dd><href="#" target="_blank" ref="nav" class="w2">对齐</a></dd>  
    8. <dd><href="#" target="_blank" ref="nav" class="w3">牛仔裤</a></dd>  
    9. <dd><href="#" target="_blank" ref="nav" class="w4">小家碧玉</a></dd>  
    10. <dd><href="#" target="_blank" ref="nav" class="w2">家居</a></dd>  
    11. </dl></span>  
  • 相关阅读:
    LCA算法总结
    【福利】论机房如何关闭方正软件保护卡
    codevs 2190 有理逼近
    用C语言的rand()和srand()产生伪随机数的方法总结
    float,double等精度丢失问题 float,double内存表示
    #incldue<cctype>函数系列
    poj 2348 Euclid's Game 题解
    poj 2240 Arbitrage 题解
    洛谷 p1352 没有上司的舞会 题解
    BZOJ 1093 最大半连通子图 题解
  • 原文地址:https://www.cnblogs.com/qhhw/p/7122179.html
Copyright © 2011-2022 走看看