繁体中文
设为首页
加入收藏
当前位置:在线教程首页 >> 网页设计 >> CSS与特效 >> CSS实用教程(六)

CSS实用教程(六)

2005-05-25 17:55:00  作者:佚名  来源:第七频道  浏览次数:122  文字大小:【】【】【

十.控制列表的样式 

列表是HTML里一种很有用的显示方式,可以把相关的并列内容整齐地垂直排列,使网页显得整洁专业,并让浏览者有一目了然的感觉。 

样式表为列表增加了一些功能,控制列表的样式包括列表样式、图形符号、列表位置三个部分。 

1.列表符号 

列表符号是指显示于每一个列表项目前的符号标识。 

基本格式如下: 

list-style-type:参数 

参数取值范围: 

·disc:圆形 

·circle:空心圆 

·square:方块 

·decimal:十进制数字 

·lower-roman:小写罗马数字 

·upper-roman:大写罗马数字 

·lower-alpha:小写希腊字母 

·upper-alpha:大写希腊字母 

·none:无符号显示 

参数中的disc是默认选项。 

2.图形符号 

图形符号指原来列表的项目符号将可以使用图形来代替。 

基本格式如下: 

list-style-image:URL 

URL是用来代替项目符号的图形文件的地址,可以使用相对地址或绝对地址。 

3.列表位置 

列表位置描述列表在何处显示。 

基本格式如下: 

list-style-position:参数 

参数取值范围: 

·inside:在BOX模型内部显示 

·outside:在BOX模型外部显示 

这里又出现了一个新的概念:BOX模型。BOX是指一种容器,包含了应用样式规则的对象,具体介绍将在后文中给出。 

十一.控制用户界面的样式 

在网页上,鼠标平时呈箭头形,指向链接时成为手形,等待网页下载时成为沙漏形……这似乎是约定俗成的。虽然这样的设计能使我们知道浏览器现在的状态或是可以做什么,但这些好像还不能完全地满足我们的需要。就拿链接来说,可以是指向一个帮助文件,也可以是向前进一页或是向后退一页,针对如此多的功能光靠千篇一律的手形鼠标是不能说明问题的。值得庆幸的是,CSS提供了多达13种的鼠标形状,供我们选择。 

基本格式如下: 

cursor:鼠标形状参数 

CSS鼠标形状参数表: 

CSS代码 

鼠标形状 

style="cursor:hand" 

手形 

style="cursor:crosshair" 

十字形 

style="cursor:text" 

文本形 

style="cursor:wait" 

沙漏形 

style="cursor:move" 

十字箭头形 

style="cursor:help" 

问号形 

style="cursor:e-resize" 

右箭头形 

style="cursor:n-resize" 

上箭头形 

style="cursor:nw-resize" 

左上箭头形 

style="cursor:w-resize" 

左箭头形 

style="cursor:s-resize" 

下箭头形 

style="cursor:se-resize" 

右下箭头形 

style="cursor:sw-resize" 

左下箭头形 

此文章不能满足您的需求?那就就Google一下吧:)
Google
 

责任编辑:admin


相关文章
服务器内存技术知识充电
服务器端口过滤防黑法
服务器硬件故障处理几例
FTP命令详解
表格对决CSS
CSS应用常见问题
CSS样式应用技巧
巧用CSS制作树状目录
CSS类及id的规范化命名
用 CSS 实现的阴影效果
CSS实用教程(一)
 

最新文章

更多

· 关于CSS你只需知道的十件事
· CSS网站实用技巧:word-...
· CSS实战:解决图片下面有...
· 中文网页制作中段落缩进...
· 巧用CSS制作树状目录
· CSS重新定义项目符号和编号
· 网页特效大公开
· css新手上路<七>
· css新手上路<六>
· css新手上路<五>

推荐文章

更多

· 关于CSS你只需知道的十件事
· CSS网站实用技巧:word-...
· CSS实战:解决图片下面有...
· 中文网页制作中段落缩进...
· 巧用CSS制作树状目录
· CSS重新定义项目符号和编号
· 网页特效大公开
· css新手上路<七>
· css新手上路<六>
· css新手上路<五>

热点文章

更多