zoukankan      html  css  js  c++  java
  • 大量链接列表时不会在文字中间断行

    如题,大量链接列表时不会在文字中间断行,上次做友情链接的时候一直没有找到方法。
    曾经试过用<wbr>加<nobr>来有选择地分行,结果IE成功,FF不支持。
    今天分析sohu博客首页,搞定。原来以前没有搜索正确啊,现在一搜居然早就有答案了 :(

    放在这里,最近正好要用到,希望有需要用的朋友能看到。

    <style>
    .list
    {
        width
    :500px;
    }
    .list ul li
    {
        white-space
    : nowrap;
        float
    :left;
    /*    display:inline;*/
    }
    </style>
    </HEAD>

    <BODY>
    <div class="list">
        
    <ul>
            
    <li><href="#">余秋雨</a>|</li>
            
    <li><href="#">易中天</A>|</li>
            
    <li><href="#">徐兆寿</a>|</li>
            
    <li><href="#">易宪容</a>|</li>
            
    <li><href="#">吴澧</a>|</li>
            
    <li><href="#">黎鸣</a>|</li>
            
    <li><href="#">张起淮</A>|</li>
            
    <li><href="#">傅国涌</a>|</li>
            
    <li><href="#">李银河</a>|</li>
            
    <li><href="#">司马南</A>|</li>
            
    <li><href="#">庄羽</a>|</li>
            
    <li><href="#">魏子</A>|</li>
            
    <li><href="#">汪丁丁</a>|</li> 
            
    <li><href="#">马少华</a>|</li>
            
    <li><href="#">张五常</a>|</li>
            
    <li><href="#">张维迎</A>|</li>
            
    <li><href="#">洪峰</a>|</li>
            
    <li><href="#">思公</A>|</li>
            
    <li><href="#">王少磊</A>|</li>
            
    <li><href="#">章立凡</A>|</li>
            
    <li><href="#">王育琨</A>|</li>
            
    <li><href="#">蔡天新</A>|</li>
            
    <li><href="#">高光</a>|</li>
            
    <li><href="#">苏芩</a>|</li>
            
    <li><href="#">周国平</a>|</li>
            
    <li><href="#">徐小平</A>|</li>
            
    <li><href="#">李文子</A>|</li>
            
    <li><href="#">袁熙坤</A>|</li>
            
    <li><href="#">忆清</a>|</li>
            
    <li><href="#">石康</A>|</li>
            
    <li><href="#">陈志武</A>|</li>
            
    <li><href="#">步非烟</A>|</li>
            
    <li><href="#">古清生</a>|</li>
            
    <li><href="#">葛红兵</a>|</li>
            
    <li><href="#">端木</A>|</li>
            
    <li><href="#">国忠</A>|</li>
        
    </ul>
    </div>

    其实,就一个white-space:nowrap;搞定。
  • 相关阅读:
    openstack controller ha测试环境搭建记录(七)——配置glance
    openstack controller ha测试环境搭建记录(六)——配置keystone
    openstack controller ha测试环境搭建记录(五)——配置rabbitmq集群
    spring classpath & classpath*
    SVN相关
    eclipse安装springboot插件
    Hbase Shell常用命令
    CentOS下安装Hbase
    CentOS安装JDK-tar.gz文件
    Linux常用命令
  • 原文地址:https://www.cnblogs.com/nonlyli/p/684622.html
Copyright © 2011-2022 走看看