• CSS 笔记——列表表格


    6. 列表表格

    -> 列表

    (1)list-style

    基本语法

    list-style : list-style-image || list-style-position || list-style-type

    语法取值

    该属性是复合属性。请参阅各参数对应的属性。
    默认值为:disc outside none。

    使用说明

    设置列表项目相关样式。当 list-style-image 和 list-style-type 都被指定了时, list-style-image 将获得优先权。除非 list-style-image 设置为 none 或指定 url 地址的图片不能被显示。

    (2)list-style-image

    基本语法

    list-style-image : none | url ( url )

    语法取值

    none         :  默认值。不指定图像 
    url ( url )  :  使用绝对或相对 url 地址指定图像

    使用说明

    设置或检索作为对象的列表项标记的图像。若此属性值为 none 或指定 url 地址的图片不能被显示时, list-style-type 属性将发生作用。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。

    (3)list-style-position

    基本语法

    list-style-position : outside | inside 

    语法取值

    outside  :  默认值。列表项目标记放置在文本以外,且环绕文本不根据标记对齐 
    inside   :  列表项目标记放置在文本以内,且环绕文本根据标记对齐 

    使用说明

    设置或检索作为对象的列表项标记如何根据文本排列。假如一个列表项目的左外边距( margin-left )被设置为 0 ,则列表项目标记不会被显示。左外边距( margin-left )最小可以被设置为 30 。仅作用于具有 display 属性值等于 list-item 的对象。如 li 对象。注意: ol 对象和 ul 对象的 type 属性为其后的所有列表项目(如 li 对象)指明列表属性。此属性对于 currentStyle 对象而言是只读的。

    (4)list-style-type

    基本语法

    list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | armenian | cjk-ideographic | georgian | lower-greek | hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha | lower-latin | upper-latin 

    语法取值

    disc            :  CSS1  默认值。实心圆 
    circle          :  CSS1  空心圆 
    square          :  CSS1  实心方块 
    decimal         :  CSS1  阿拉伯数字 
    lower-roman     :  CSS1  小写罗马数字 
    upper-roman     :  CSS1  大写罗马数字 
    lower-alpha     :  CSS1  小写英文字母 
    upper-alpha     :  CSS1  大写英文字母 
    none            :  CSS1  不使用项目符号 
    armenianl       :  CSS2  未支持。传统的亚美尼亚数字 
    cjk-ideographic :  CSS2  未支持。浅白的表意数字 
    georgian        :  CSS2  未支持。传统的乔治数字 
    lower-greek     :  CSS2  未支持。基本的希腊小写字母 
    hebrew          :  CSS2  未支持。传统的希伯莱数字 
    hiragana        :  CSS2  未支持。日文平假名字符 
    hiragana-iroha  :  CSS2  未支持。日文平假名序号 
    katakana        :  CSS2  未支持。日文片假名字符 
    katakana-iroha  :  CSS2  未支持。日文片假名序号 
    lower-latin     :  CSS2  未支持。小写拉丁字母 
    upper-latin     :  CSS2  未支持。大写拉丁字母 

    使用说明

    设置或检索对象的列表项所使用的预设标记。若 list-style-image 属性值为 none 或指定 url 地址的图片不能被显示时,此属性将发生作用。假如一个列表项目的左外补丁( margin-left )被设置为 0 ,则列表项目标记不会被显示。左外补丁( margin-left )最小可以被设置为 30 。仅作用于具有 display 属性值等于 list-item 的对象。如 li 对象。
    注意: ol 对象和 ul 对象的 type 属性为其后的所有列表项目(如 li 对象)指明列表属性。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。

    (5)marker-offset

    基本语法

    marker-offset : auto | length 

    语法取值

    auto    :  默认值。浏览器自动设置间距 
    length  :  由浮点数字和单位标识符组成的长度值。可为负值。请参阅 长度单位 

    使用说明

    设置或检索标记容器和主容器之间水平补白。即两个容器靠近的一边的间距。作用于 display 属性值为 marker 的元素。

    -> 表格

    (1)border-collapse

    基本语法

    border-collapse : separate | collapse 

    语法取值

    separate  :  默认值。边框独立(标准HTML) 
    collapse  :  相邻边被合并

    使用说明

    设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。

    (2)border-spacing

    基本语法

    border-spacing : length

    语法取值

    length  :  由浮点数字和单位标识符组成的长度值。不可为负值。

    使用说明

    设置或检索当表格边框独立(例如当 border-collapse 属性等于 separate 时),行和单元格的边在横向和纵向上的间距。当只指定一个
    length 值时,这个值将作用于横向和纵向上的间距。当指定了两个 length 值时,第一个作用于横向间距,第二个作用于纵向间距。

    (3)caption-side

    基本语法

    caption-side : top | right | bottom | left 

    语法取值

    top     :  默认值。 caption 在表格的上边 
    right   :  caption 在表格的右边 
    bottom  :  caption 在表格的下边 
    left    :  caption 在表格的左边

    使用说明

    设置或检索表格( table )的 caption 对象是在表格的那一边。它是和 caption 对象一起使用的属性。

    (4)empty-cells

    基本语法

    empty-cells : show | hide 

    语法取值

    show  :  默认值。显示边框 
    hide  :  隐藏边框 

    使用说明

    设置或检索表格( table )的 caption 对象是在表格的那一边。它是和 caption 对象一起使用的属性。

    转载于:https://www.cnblogs.com/xzh0717/p/10658488.html

  • 相关阅读:
    Comet OJ
    LOJ#2719. 「NOI2018」冒泡排序 DP+组合+树状数组
    LuoguP6747 『MdOI R3』Teleport 二进制+贪心
    LuoguP6748 『MdOI R3』Fallen Lord 树形DP+set
    LuoguP5576 [CmdOI2019]口头禅 后缀树+线段树+暴力
    LOJ#3161. 「NOI2019」I 君的探险 整体二分+随机化+二进制分组
    LOJ#2085. 「NOI2016」循环之美 莫比乌斯反演+杜教筛
    LuoguP5327 [ZJOI2019]语言 线段树合并+树链求并
    【考试题
    ELK
  • 原文地址:https://www.cnblogs.com/twodog/p/12134956.html
Copyright © 2020-2023  润新知