Rumah > hujung hadapan web > html tutorial > 用<ul><li>做一个二级导航 怎样使ul中的li竖着排列呢_html/css_WEB-ITnose

用<ul><li>做一个二级导航 怎样使ul中的li竖着排列呢_html/css_WEB-ITnose

WBOY
Lepaskan: 2016-06-24 11:43:38
asal
3579 orang telah melayarinya

  • 地址

    • 北京

    •        
    • 天津

    •         
    • 上海

    •         
    • 河北

    •        
    • 山东

    •        
    • 山西

    •       
    • 河南

    •        
    • 安徽

    •       
    • 湖南

    •      
    • 陕西

    •        
    • 四川

    •      
    • 湖北

    •     


  • 怎样实现ul里像图片中这种效果呢


    回复讨论(解决方案)

    .sub-menu{-moz-column-count:3;-webkit-column-count:3;column-count:3;}
    Salin selepas log masuk

    nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



    无标题文档




  • 地址


    • 北京

    •        
    • 天津

    •         
    • 上海


          

    • 北京

    •        
    • 天津

    •         
    • 上海



    • 北京

    •        
    • 天津

    •         
    • 上海





    将 div 元素中的文本分为三列:
    div
    {
    -moz-column-count:3; /* Firefox */
    -webkit-column-count:3; /* Safari 和 Chrome */
    column-count:3;
    }

    Internet Explorer 10 和 Opera 支持 column-count 属性。
    Firefox 支持替代的 -moz-column-count 属性。
    Safari 和 Chrome 支持替代的 -webkit-column-count 属性。
    注释:Internet Explorer 9 以及更早版本的浏览器不支持 column-count 属性。
    定义和用法
    column-count 属性规定元素应该被划分的列数。
    默认值: auto
    继承性: no
    版本: CSS3
    JavaScript 语法: object.style.columnCount=3
    语法
    column-count: number|auto;
    值 描述 测试
    number 元素内容将被划分的最佳列数。 测试
    auto 由其他属性决定列数,比如 "column-width"。 测试




    规定列间 60 像素的间隔

    注释:Internet Explorer 不支持 column-count 属性。

    非常感谢

  • sumber:php.cn
    Kenyataan Laman Web ini
    Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
    Tutorial Popular
    Lagi>
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan