好学IT学院：IT信息技术分享交流平台
好学网>>好学IT学院>软件开发技术>>Web前端技术
CSS2学习笔记(四) 2006-05-01
来源：本站原创  作者：开拓者  发布时间：2006-05-02  ★★★〖加入收藏〗〖手机版〗
摘要：13、list-style 版本：CSS1 兼容性：IE4+ NS4+继承性：有语法：list-style : list-style-image || list-style-position || list-style-type 参数：该属……

13、list-style 版本：CSS1　 兼容性：IE4+ NS4+　继承性：有

    语法：list-style : list-style-image || list-style-position || list-style-type
    参数：该属性是复合属性。请参阅参数list-style-image list-style-position list-style-type对应的属性。
    说明：
    设置列表项目相关内容。对应的脚本特性为listStyle。
    示例：
    li { list-style: url("http://www.dhtmlet.com/devgurupix.gif"), inside, circle; }
    ul { list-style: outside, upper-roman; }
    ol { list-style: square; }

14、list-style-image 版本：CSS1　 兼容性：IE4+ NS6+　继承性：有

    语法：list-style-image : none | url (url)
    参数：
    none : 不指定图像
    url : 使用绝对或相对地址指定背景图像
    说明：
    设置或检索作为对象的列表项标记的图像。
    若list-style-image属性为none或指定图像不可用时，list-style-type属性将发生作用。
    对应的脚本特性为listStyleImage。
    示例：
    ul.out { list-style-position: outside; list-style-image: url("images/ie.gif"); }

15、list-style-position 版本：CSS1　 兼容性：IE4+ NS6+　继承性：有

    语法：list-style-position : outside | inside
    参数：
    outside : 　列表项目标记放置在文本以外，且环绕文本不根据标记对齐
    inside : 　列表项目标记放置在文本以内，且环绕文本根据标记对齐
    说明：
    设置或检索作为对象的列表项标记如何根据文本排列。
    仅作用于具有display值等于list-item的对象（如li对象）。
    注意：ol对象和ul对象的type特性为其后的所有列表项目（如li对象）指明列表属性。请参阅我的其他著作。对应的脚本特性为listStylePosition。
    示例：
    ul.in { display: list-item; list-style-position: inside; }

16、list-style-type 版本：CSS1/CSS2　 兼容性：IE4+ NS4+　继承性：有

    语法：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　不使用项目符号
    armenian : 　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或指定图像不可用时，list-style-type属性将发生作用。
    仅作用于具有display值等于list-item的对象（如li对象）。
    注意：ol对象和ul对象的type特性为其后的所有列表项目（如li对象）指明列表属性。请参阅我的其他著作。IE5.5尚不支持所有CSS2的值。对应的脚本特性为listStyleType。
    示例：
    li { list-style-type: square }

    • 新世纪平台以专业的的精神科学的素质提供一流的信息化建设服务；专业承诺：像素精确、代码最优、负载最小、跨平台兼容
    • 新世纪平台以专业的的精神科学的素质提供一流的信息化建设服务；专业承诺：像素精确、代码最优、负载最小、跨平台兼容
    • 新世纪平台以专业的的精神科学的素质提供一流的信息化建设服务；专业承诺：像素精确、代码最优、负载最小、跨平台兼容

    　 　

17、table-layout 版本：CSS2　 兼容性：IE5+　继承性：有

    语法：table-layout : auto | fixed
    参数：
    auto : 　默认的自动算法。布局将基于各单元格的内容。表格在每一单元格读取计算之后才会显示出来。速度很慢
    fixed : 　固定布局的算法。在这算法中，水平布局是仅仅基于表格的宽度，表格边框的宽度，单元格间距，列的宽度，而和表格内容无关。也就是说，内容可能被裁切
    说明：
    设置或检索表格的布局算法。对应的脚本特性为tableLayout。
    示例：
    table { table-layout: auto; }

18、border-collapse 版本：CSS2　 兼容性：IE5+　继承性：有
    语法：border-collapse : separate | collapse
    参数：
    separate : 　边框独立（标准HTML）
    rtl : 　相邻边被合并
    说明：设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。对应的脚本特性为borderCollapse。
    示例：
    table { border-collapse: separate; }

19、cursor 版本：CSS2　 兼容性：IE4+ NS6+　继承性：无

    语法：cursor : auto | crosshair | default | hand | move | help | wait | text | w-resize |s-resize | n-resize |e-resize | ne-resize |sw-resize | se-resize | nw-resize |pointer | url (url)
    参数： 
    crosshair default hand pointer
    move help wait text
    w-resize s-resize n-resize e-resize
    ne-resize sw-resize se-resize nw-resize
    auto url(img/1001.gif)
    您将鼠标在上方的表格内移动，就能看到本属性在您当前的软件环境下可以使用的样式。
    以这种颜色为背景色的是IE5.5尚不支持的值。
    说明：
    设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。对应的脚本特性为cursor。
    示例：
    p { cursor: text; }
    a { cursor: pointer; }
    body { cursor: url("mycursor.gif"), url("images/cursors/footcursor.jpg"), default; }

20、filter 版本：IE4+专有属性　继承性：无

    语法：filter : filter
    参数：
    filter : 　要使用的滤镜效果。多个滤镜之间用空格隔开。
    说明：
    设置或检索对象所应用的滤镜效果。
    要使用该属性，对象必须具有height，width，position三个属性中的一个。
    滤镜的机制是可扩展的。可以开发和使用第三方滤镜。
    该属性在MAC平台上不可用。
    对应的脚本特性为filter。
    示例：
    div { width:200px; filter:blur(strength=50) flipv() ; }
    img { filter: invert(); }

CSS2学习笔记(四)
·经典推荐：专业网页设计教程
经典推荐：专业网页设计教程
  看过很多网页设计教程文章，但不是说的太高深，对我们实际设计工作并无什么用处，就是东拼西凑的用PHOTOSHOP做几个效果，就是所谓…
  • 好学考试H5触屏版开放内测
  • 好学触屏公众号虎力全开、杨帆起航！