第7章 用CSS设置页面和浏览器元素.pptVIP

DIV+CSS网页样式与布局 第7章 CSS设置页面和浏览器元素 丰富的超级链接特效 动态链接(7-1.html) 可制作动态效果的CSS伪类别属性 丰富的超级链接效果 按钮时超链接(7-2.html) 对a标记进行整体控制,同时加入CSS的3个伪属性. 丰富的超链接效果 浮雕式超链接(7-3.html) 除了背景颜色和边框等传统的CSS样式,如果将背景图片也加入到超链接的伪属性中,就可以制作出绚丽的效果.本例即通过超链接按背景图片的变换,实现浮雕效果. 鼠标特效 CSS控制鼠标箭头 CSS控制鼠标主要是通过cursor属性来实现的，该属性可以在任何标记里使用，从而可以改变各种页面元素的鼠标效果。body{ cursor:pointer; } Pointer是一个很特殊的鼠标指针值，它表示将鼠标设置为被激活状态，即鼠标指针经过超链接时，该浏览器默认的鼠标指针样式。 鼠标特效 鼠标变幻的超链接(7-4.html) 将鼠标设置成外部图片格式: cursor:url(鼠标文件) 注:鼠标文件扩展名为.ani .cur 页面滚动条 对于IE浏览器，可以单独设置滚动条样式，从而使其更加符合网站的整体设计。 滚动条组成 3dlight、highlight、face、arrow、shadow、darkshadow组成 3dlight、highlight高亮部分，都只有一个像素；3dlight在外，highlight在里，就形成了立体效果。 Shadow和darkshadow也是同样的道理，shadow在里，darkshadow在外。 Scrollbar-base-color它设置的是滚动条的默认基调颜色,即当其他任何一项属性没有被设置时,那一项所默认显示的颜色. 页面滚动条 实例文件(7-5.html) * * 在超链接上单击时,即”当前激活”时,超链接的样式 a:active 被点击过的超级链接的样式 a:visited 鼠标指针经过超级链接的样式 a:hover 超链接普通样式,即正常浏览状态的样式 a:link 说明 属性 技术背景 当前激活状态”a:active”一般被显示的情况非常少,因此很少使用.因为当用户单击一个超链接后,焦点很容易就会从这个链接上转移到其他地方,例如新打开的窗口等,此时该超链接就不再是”当前激活”状态了. 禁止光标 No-allowed 移动 move 手形光标 hand 帮助 help 等待光标 Wait 箭头 default 文本光标 text + crosshair 滚动光标 All-scroll 默认值 auto 指针说明 鼠性值 指针说明 属性值