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>  
  • 相关阅读:
    tomact配置
    cesium环境配置
    电脑上压缩文件不显示图标的解决办法
    MSCE C#官网一步步学习搬运9 第九章、用C++/CLI编写Addins
    MSCE | MDL二次开发知识点与遇到的问题记录
    MSCE C++官网一步步学习搬运7
    MSCE C++官网一步步学习搬运6
    geotools模块梳理
    geoserver 安全配置
    mapbox去除logo控件和attribution控件
  • 原文地址:https://www.cnblogs.com/qhhw/p/7122179.html
Copyright © 2011-2022 走看看