加入收藏
设为首页
网站地图
校内网代码 校内网CSS代码 涂鸦板代码 非主流代码 校内网男生代码 校内网女生代码 校内网班群代码 校内网教程 校内猫游记

当前位置:主页 > 校内网教程 > 正文
校内网列表CSS代码
作者:佚名    文章来源:www.xiaoneipk.com    点击数:    更新时间:2008-5-22

序号 中文说明 标记语法 备注
1 控制空白 {white-space:normal|pre|nowarp}
2 控制显示 {display:none|block|inline|list-item}     
3 符号列表 {list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none}  
4 图形列表 {list-style-image:URL}  
5 目录列表 {list-style:目录样式类型|目录样式位置|url} 
6 位置列表 {list-style-position:inside|outside}   
7 鼠标形状 {cursor:hand|crosshair|text|wait|move|help|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}  


列表是HTML里一种很有用的显示方式,可以把相关的并列内容整齐地垂直排列,使网页显得整洁专业,并让浏览者有一目了然的感觉。
样式表为列表增加了一些功能,控制列表的样式包括列表样式、图形符号、列表位置三个部分。


1.控制空白:white-space

语法:{white-space:normal|pre|nowarp}
作用:控制元素內的空白。
说明:
·normal 不改变,保持缺省值,在浏览器页面长度处换行。
·pre 要求文档显示中采用源代码中的格式。
·nowarp 不让访问者在元素內换行。
2. 控制显示:display

语法:{display:none|block|inline|list-item}
作用:改变元素的显示值,可以将元素类型线上,块和清单项目相互变换。
说明:
·none 不显示元素
·block 块显示,在元素前后设置分行符
·inline 删除元素前后的分行符,使其并入其它元素流中
·list-item 将元素设置为清单中的一行
注意:可用 display 属性值生成插入标题和补加清单或让图形变成线上显示。

3、符号列表:list-style-type

语法:{list-style-type:none|disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha}
作用:指定清单所用的强调符或编号类型
说明:
·none - 无强调符
·disc - 碟形强调符(实心圆)
·circle - 圆形强调符(空心圆)
·square - 方形强调符(实心)
·decimal - 十进制数强调符
·lower-roman - 小写罗馬字强调符
·upper-roman - 大写罗馬字强调符
·lower-alpha - 小写字母强调符
·upper-alpha - 大写字母强调符
例子:
LI.square { list-style-type: square }
UL.plain { list-style-type: none }
OL { list-style-type: upper-alpha }
OL OL { list-style-type: decimal }
OL OL OL { list-style-type: lower-roman }
4、图片列表:list-style-image

语法:{list-style-image:URL}
作用:用于将清单中标准强调符换成所选的图形
说明:
·url - 图形URL地址
例子:
UL.check { list-style-image: url(/LI-markers/checkmark.gif) }
UL LI.x { list-style-image: url(x.png) }
5. 目录列表:list-style

语法:{list-style:目录样式类型|目录样式位置|url}
作用:目录样式属性是目录样式类型、目录样式位置,和目录样式图象属性的略写
说明:
·list-style-type
·list-style-position
·list-style-image
注意:这些值的细节见各个属性部分。
例子:
LI.square { list-style: square inside }
UL.plain { list-style: none }
UL.check { list-style: url(/LI-markers/checkmark.gif) circle }
OL { list-style: upper-alpha }
OL OL { list-style: lower-roman inside }

6. 位置列表:list-style-position

语法:{list-style-position:inside|outside}
作用:用于设置强调符的缩排或伸排,这个属性可以让强调符突出于清单以外或与清单项目对齐。
说明:
·inside - 缩排,将强调符与清单项目内容左边界对齐
·outside - 伸排,强调符突出到清单项目内容左边界以外

7.鼠标形状cursor

语法:{cursor:hand|crosshair|text|wait|move|help|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}
作用:CSS提供了多达13种的鼠标形状,供我们选择。
说明:
·hand 手形
·crosshair 十字形
·text 文本形
·wait 沙漏形
·move 十字箭头形
·help 问号形
·e-resize 右箭头形
·n-resize 上箭头形
·nw-resize 左上箭头形
·w-resize 左箭头形
·s-resize 下箭头形
·se-resize 右下箭头形
·sw-resize 左下箭头形

 

发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
 
  • 上一个文章:

  • 下一个文章:
  • 相关文章
    校内网代码七彩脚印
    校内网VIP LOVE MY HOME…
    榕树
    校内网VIP卡通狮子
    校内网留言板表情代码
    怎么换校内网背景
    校内网音乐代码收集三
    校内网音乐代码收集二
    校内网音乐代码收集一
    添加校内网挂件的方法
    最新更新
     任意移动“在线好友”的方法
     校内网留言板表情代码
     怎么换校内网背景
     校内网列表CSS代码
     添加校内网挂件的方法
     详解css里所用到的单位
     班级群友情链接添加
     校内网群页面代码美化技巧
     改变链接字体和颜色
     必修教程:认识HTML语法
    文 章 TOP 10
     如何改变链接字体和颜色
     快速添加各种flash
     给页面加滚动文字
     教你用CSS在校内网添加音乐
     改变鼠标样式
     藏宝箱使用说明及方法
     任意移动“在线好友”的方法
     详解css里所用到的单位
     必修教程:认识HTML语法
     校内网CSS添加音乐方法
    - 网站地图 - 更多链接 - 联系我们 - 版权申明 - 站长信箱 -
    Copyright © 2007-2008 www.xiaonei40.com Inc. All rights reserved. 校内司令 版权所有
    陕ICP备07500646号