CSS笔记(美化超链接)

一、定义超链接
1、超链接分类
1)内部链接(链接的目标在同一网站中,直接相对路径就可以链接的,URL不需要指定协议和互联网位置)
2)外部链接(一般为外部网站目标,需要指定协议和网站地址)
3)锚点链接(锚标记后缀“#”)

2、<a>标签
<a href="https://www.baidu.com/" target="_blank">百度一下</a>
使用target属性并取值“_blank”可以在点击链接后在新的标签页中显示百度首页

3、定义锚点链接
任何被赋值了ID值的元素都可以作为锚点标记

4、定义不同目标的的链接
超链接指向的目标对象可以是网页,还可以是一个图片、一个电子邮件、一个文件、FTP服务器,甚至是一个应用程序,也可以是一段javascript脚本
<a href="javascript:alert(&quot;谢谢关注,投票已结束。&quot;)">我要投票</a>

5、定义热点区域
定义热点区域需要<map><area>配合使用
<map>定义热点区域。包含必须的ID属性,定义热点区域的ID,或者定义可选的name属性,也可以作为句柄。
<img>中的usemap属性可引用<map>中的id或name属性(根据浏览器),所以应同时向<map>添加id和name属性,且设置相同的值
<area>定义图像映射中的区域,area元素必须嵌套在<map>标签中。改标签包含一个必须设置的属性alt,定义热点区域的替换文本。还包含其他可选属性coords(坐标值)、href、nohref、shape(区域形状)、target(规定何处打开href指定的)
(建议使用可视化设计视图)

6、定义框架链接
H5不再支持frameset框架,但是仍然支持iframe浮动框架的使用,实现窗口中再创建一个窗口
<iframe src="URL"></iframe>

二、定义超链接样式
1、伪类
伪类就是根据一定的特征对元素进行分类,而不根据元素的名称、属性或内容。
与超链接相关的基本伪类:link、:visited、:hover、:active、:focus,且定义的先后顺序有讲究

2、定义鼠标样式
使用CSS的cursor属性可以定义鼠标在指定对象上的样式,取值如下:
auto:基于上下文选择应该显示什么光标
crosshair:十字光标
default:基于平台的默认光标,通常渲染为一个箭头
pointer:指针光标,表示一个超链接
move:十字头光标,表示对象可移动
e-resize、ne-resize、nw-resize、n-resize、se-resize、sw-resize、s-resize、w-resize:表示正在移动某个边
text:表示可以选择文本,I型光标
wait:表示程序正忙,需要用户等待,通常渲染为手表或沙漏
help:光标下的对象包含有帮组内容,通常渲染为一个问号或一个气球
<uri>URL:自定义光标类型的图标路径

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值