转至繁体中文版     | 网站首页 | 图文教程 | 资源下载 | 站长博客 | 图片素材 | 武汉seo | 武汉网站优化 | 
最新公告:     敏韬网|教学资源学习资料永久免费分享站!  [mintao  2008年9月2日]        
您现在的位置: 学习笔记 >> 图文教程 >> 站长学院 >> 网页制作 >> 正文
CSS之Lists及Classification对象说明、例子         ★★★★

CSS之Lists及Classification对象说明、例子

作者:闵涛 文章来源:闵涛的学习笔记 点击数:879 更新时间:2009/6/9 2:30:19

一:list-style

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

二:list-style-image

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

三:list-style-position

语法:
 
list-style-position : outside | inside
 
参数:
 
outside :  列表项目标记放置在文本以外,且环绕文本不根据标记对齐
inside :  列表项目标记放置在文本以内,且环绕文本根据标记对齐
 
说明:
 
设置或检索作为对象的列表项标记如何根据文本排列。
仅作用于具有display值等于list-item的对象(如li对象)。
 
示例:
 
ul.in { display: list-item; list-style-position: inside; }

四: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 不使用项目符号
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对象)。
 
示例:
 
li { list-style-type: square }

五:marker-offset

语法:
 
marker-offset : auto | length
 
参数:
 
auto :  浏览器自动设置间距
length :  由浮点数字和单位标识符组成的长度值。可为负值。请参阅长度单位
 
说明:
 
设置或检索标记容器和主容器之间水平补白。即两个容器靠近的一边的间距。 
 
示例:
 
li:before { display: marker; marker-offset: 5px; }

六:cursor

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(imgs/123.gif)

您将鼠标在上方的表格内移动,就能看到本属性在您当前的软件环境下可以使用的样式。
以这种颜色为背景色的是IE5.5尚不支持的值。
 
说明:
 
设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。 
 
示例:
 
p { cursor: text; }
a { cursor: pointer; }
body { cursor: url("mycursor.gif"), url("images/cursors/footcursor.jpg"), default; }

七:behavior

语法:
 
behavior : url (url) | url (#objID ) | url (#default#behaviorName)
 
参数:
 
url (url) : 使用绝对或相对地址指定DHTML行为组件(.htc)
url (#objID ) : 用二进制实现DHTML行为,#objID为object对象指定的id特性
url (#default#behaviorName) : IE的默认行为。由behaviorName指定
 
说明:
 
设置或检索对象的DHTML行为。
多个行为之间用空格隔开。 
 
示例:
 
div { behavior: url(fly.htc) url(shy.htc); }

八:filter

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

九:zoom

语法:
 
zoom : normal | number
 
参数:
 
normal :  使用对象的实际尺寸
number :  百分数|无符号浮点实数。浮点实数值为1.0或百分数为100%时相当于此属性的normal值
 
说明:
 
设置或检索对象的缩放比例。  
 
示例:
 
div {zoom : 0.75; }


[办公软件]Office(Word,Excel)密码破解软件(Office Password…  [办公软件]无法打开Excel文件(*.xls)之最佳答案(工具选项配置…
[Web开发]NET实现文件上传CS源代码  [Web开发]增加或修改Session的会话时间
[Web开发]ASP.NET 2.0使用CSS失效的解决办法  [Web开发]CSC命令使用示例(将CS文件编译成DLL文件)
[Web开发]csc命令详解(在NET环境中DOS状态下使用)  [Web开发]ASP.NET动态加载不同CSS,实现切换皮肤效果
[Web开发]一大堆常用的超强的正则表达式及RegularExpressio…  [网页制作]什么是CSS+DIV
教程录入:mintao    责任编辑:mintao 
  • 上一篇教程:

  • 下一篇教程:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
      注:本站部分文章源于互联网,版权归原作者所有!如有侵权,请原作者与本站联系,本站将立即删除! 本站文章除特别注明外均可转载,但需注明出处! [MinTao学以致用网]
      网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)

    同类栏目
    · Web开发  · 网页制作
    · 平面设计  · 网站运营
    · 网站推广  · 搜索优化
    · 建站心得  · 站长故事
    · 互联动态
    更多内容
    热门推荐 更多内容
  • 没有教程
  • 赞助链接
    更多内容
    闵涛博文 更多关于武汉SEO的内容
    500 - 内部服务器错误。

    500 - 内部服务器错误。

    您查找的资源存在问题,因而无法显示。

    | 设为首页 |加入收藏 | 联系站长 | 友情链接 | 版权申明 | 广告服务
    MinTao学以致用网

    Copyright @ 2007-2012 敏韬网(敏而好学,文韬武略--MinTao.Net)(学习笔记) Inc All Rights Reserved.
    闵涛 投放广告、内容合作请Q我! E_mail:admin@mintao.net(欢迎提供学习资源)

    站长:MinTao ICP备案号:鄂ICP备11006601号-18

    闵涛站盟:医药大全-武穴网A打造BCD……
    咸宁网络警察报警平台