网络编程
位置:首页>> 网络编程>> 网页设计>> 解析CSS列表样式属性list-style

解析CSS列表样式属性list-style

 来源:ayan2006的日志 发布时间:2009-03-26 13:16:00 

标签:css,属性,列表,list-style

平时制作页面中可对属性list-style在list-item对象中常用,但用的都不深。一般都设为none重置整个页面就差不多OK,可能很多人包括本人对属性list-style-type更细节方面的属性并不是很了解,更有可能对属性list-style和属性list-style-type概念会比较模糊,现有必要把它提出来重新学习一下,故整理如下。

● list-style

定义:用于在一个声明中设置一个列表的所有属性的简写属性,该属性是一个简写属性,涵盖了所有其他列表样式属性,仅作用于具有display值等于list-item的对象(如li对象)。

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

● list-style-image
说明: 设置或检索作为对象的列表项标记的图像。若此属性值为 none 或指定 url 地址的图片不能被显示时,list-style-type 属性将发生作用。

取值:

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

● list-style-position
说明: 设置或检索作为对象的列表项标记如何根据文本排列。假如一个列表项目的左外补丁( margin-left )被设置为 0 ,则列表项目标记不会被显示。左外补丁( margin-left )最小可以被设置为 30 。仅作用于具有 display 属性值等于 list-item 的对象。如 li 对象。

取值:

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

● list-style-type
说明: 设置或检索对象的列表项所使用的预设标记。若 list-style-image 属性值为 none 或指定 url 地址的图片不能被显示时,此属性将发生作用。

取值:

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 大写拉丁字母

补充:此CSS2.1提出的.IE6,Firefox1.5+,Opera9+支持此属性,所以以数字方式显示列表也可以用ul来指定,并不一定必需要用ol来写。

0
投稿

猜你喜欢

  • 阅读上一篇:W3C优质网页小贴士(一) 使用 alt 属性描述每幅图像alt 属性有什么用?alt 属性可以在一系列标签中使用(如
  • Data URIData URI是由RFC 2397定义的一种把小文件直接嵌入文档的方案。通过如下语法就可以把小文件变成指定编码直接嵌入到页
  • 前言在php开发过程中,获取文件扩展名是非常常见的需求。比如我们在上传文件的时候,首先需要判断文件类型是否为我们允许上传的类型。这个时候就需
  • 先按照下面的表结构创建mysql_order_by_test数据表,我们用实例一点一点告诉你,MySQL order by的用法。ORDER
  • 大家一定使用过 phpmyadmin 里面的数据库导入,导出功能,非常方便。但是在实际应用中,我发现如下几个问题:1、数据库超过一定尺寸,比
  • 当服务器必须提供与两个或更多个网络或网络子网的连接时,典型的方案是使用多宿主计算机。此计算机通常位于外围网络(也称为 DMZ、外围安全区域或
  •   ADO也提供更有效率方法来取得数据。GetRows 方法传回一个二维的数组变量,每一行对应Recordset中的一笔记录,且每
  • 本文通过一个详细的例子,来阐述了在线编辑XML文档数据的方法。由于Netscape对XML的支持比较弱,因此,要实现跨平台的数据交换,数据的
  • FrontPage服务器扩展可以做以下工作:(1),保存和检索Web服务器的文件;(2),远程执行所有文件管理操作;(3),改名或移动文件时
  • 原文地址:30 Days of Mootools 1.2 Tutorials - Day 4 - Functions函数和MooTools
  • 如果想单独取background-position的X值或Y值,IE里可以通过私有属性background-positionX或者backg
  • 最好也是最简单的办法就是利用Cookie,而不必用到数据库。当然,你愿意用数据库也可以。下面就是利用Cookie来实现的:< 
  • asp十进制转二进制;二进制转十进制;二进制转十六进制;十六进制转二进制;八进制转二进制'二进制转八进制;八进制转十进制;十六进制转
  •  家里没网络,实在无聊,玩游戏都没味道,只好玩CSS。这个东西实在没什么技术含量在里面,纯属打发时间。简单说明:一张图片放在底层,
  • INSERT、DELETE、UPDATE 三种SQL语句是数据库技术的三大基本语句. 在通常的web开发中对它的处理可以说是无处不在. 如果
  • 你喜欢在博客文章中使用图片吗?是的,如果不是很麻烦的话,相信大家都不会介意放上几张漂亮的图片来点缀一下内容的,不过你的图片可能会导致下面的两
  • 企业管理器中没有改数据库名的功能,如果一定要用企业管理器来实现,你可以备份数据库,然后还原,在还原时候可以指定另一个库名,然后再删除旧库就行
  • 事实上各式Tooltips方法非常多. 不过大部分都是用Javascript实现.例如ikshow.cn, 使用的JavaScript, D
  • 如何显示随机信息?使用了asp的randomize来创造随机数,select case来显示自定义信息。具体代码如下:<html>
  • 假如读者已经熟悉了ASP 2.0,并正在寻找3.0版本中的实际改变的列表,那么将在下面发现这些信息。假如读者是一个ASP的初学者,可以越过本
手机版 网络编程 asp之家 www.aspxhome.com