七章节用CSS设置页面和浏览器元素备课讲稿.pptVIP

  • 1
  • 0
  • 约小于1千字
  • 约 11页
  • 2019-11-30 发布于天津
  • 举报

七章节用CSS设置页面和浏览器元素备课讲稿.ppt

第七章 用CSS设置页面 和浏览器的元素 网络工程系 张红芳 qq:162038565 Tel主要内容: 用CSS设置丰富的超链接特效 鼠标特效 重点:用CSS设置超链接的特效 7.1 丰富的超链接特效 动态超链接(7-1.html) 按钮式超链接 (7-2.html) 浮雕式超链接 (7-3.html) 7.1.1 动态超链接 超链接标记a a href=“链接的具体地址”超链接文字/a 在默认的浏览器浏览方式下,超链接统一为蓝色并且 有下划线,被点击过的超链接则为紫色并且也有下划 线,如下图所示: 7.1.1 动态超链接 CSS的伪类别(7-1.html) 可制作动态效果的CSS伪类别属性 属性 说明 a:link 超链接的普通样式,即正常浏览状态的样式 a:visited 被点击过的超链接的样式 a:hover 鼠标指针经过超链接上时的样式 a:active 在超链接上单击时,即“当前激活”时,超链接的样式 7.1.2 按钮式超链接 按钮式超链接(7-2.html) 通过CSS的普通属性来模拟按钮的效果。 关键:加入CSS的3个伪属性,对a标记进行整体控制。对于普通超链接和点击过的超链接采用同样的样式,并且利用边框的样式模拟按钮效果。而对于鼠标指针经过时的超链接,相应地改变文字颜色、背景色、位置和边框,从而模拟按钮“按下去”的特效。 7.1.3 浮雕式超链接 浮雕式超链接(7-3.html) 通过超链接背景图片的变换,实现浮雕的效果。 7.2 鼠标特效 CSS控制鼠标箭头 CSS通过cursor属性可以设置各式各样的鼠标指针样式。该属性可以在任何标记里使用,从而可以改变各种页面元素的鼠标效果。 其他鼠标指针效果见书164页。 如: body{ cursor:pointer; } 7.2 鼠标特效 鼠标变换的超链接(7-4.html) * 通过超链接能够实现页面的跳转、功能的激活等,因此超链接也是与用户打交道最多的元素之一。 * * * 通过超链接能够实现页面的跳转、功能的激活等,因此超链接也是与用户打交道最多的元素之一。

文档评论(0)

1亿VIP精品文档

相关文档