博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
[转]超链接标签简单的几个样式属性
阅读量:7139 次
发布时间:2019-06-28

本文共 927 字,大约阅读时间需要 3 分钟。

原文地址:http://www.cnblogs.com/freeweb/p/4554401.html

超链接在网页中用的是最多的了,有几个属性我们或许没有注意到,我们一般都用其中的2个左右,这里总结一下,先看一个网页

1  2  3  4     
5 11 12 13 这是超链接14 15

 

 

简单的说一下,头部样式标签里面a:link是正常的未被访问过的链接样式,a:active是鼠标点下去到放开这个时间段内链接的样式,a:hover是鼠标移到超链接上超链接样式,a:visitend是已经点击过的超链接样式,常见的是百度搜索结果中我们点击一条条目之后,会发现默认颜色变了,这个是根据浏览器历史记录和缓存来的,清除痕迹之后又复原了

内部的样式:text-decoration是代表文字修饰效果,none是无下划线,underline是有下划线,blink是鼠标按下之后显示效果,overline是加上划线,line-through是加删除线,

当然还可以加颜色,字体,字号这样基本的属性,就不详细说了

有几点需要注意:a:active效果默认浏览器是鼠标点下瞬间是红色,这个我们自己可以按照上面设置;a:visited的样式和a:link相同并且除颜色外无法修改,一般我们只改变颜色;一旦a:link属性设置之后,其他属性默认都继承a:link中的效果,不用指定也可以,如果单独指出,按指出的显示;最后要知道CSS遵循先后顺序,后来的会覆盖前面的,根据这个规律布局的时候一定要考虑代码顺序,按照上面代码的属性顺序可以完整的表现超链接的四种样式,不要颠倒

根据以上几点,我们最常用的就是a默认属性和鼠标放上效果,这样代码可以精简成下面的:

a{text-decoration: none; color:blue; font-size: 18px; font-family: 微软雅黑;}a:hover{color:#09f;font-size: 19px;}

这样的话只有默认与鼠标经过两种情况,并可以实现鼠标经过字体变大的效果,这种用的比较多

以上是超链接基本属性的设置,在这个基础上我们可以结合前端脚本实现更多的效果和功能

你可能感兴趣的文章
理解extern
查看>>
mongoDB - 安装
查看>>
xp安装maven
查看>>
hdu1686(kmp)
查看>>
Facebook拟投资10亿美元在弗吉尼亚州打造数据中心
查看>>
理解索引:MySQL执行计划详细介绍
查看>>
从0到1:打造移动端H5性能测试平台
查看>>
redis 目录
查看>>
Linux-13软件安装
查看>>
写了C# ASP.NET WebService的XML解析网站接口程序收了200元辛苦费【加入软件项目源码交易群的好处】...
查看>>
为1900个JNI函数添加日志
查看>>
部署android开发环境总结
查看>>
我的友情链接
查看>>
利用makefile构建c++项目的思路介绍
查看>>
ssh的反向隧道
查看>>
F5 DDoS防御小妙招:减轻DDoS***危害的六大最佳方法
查看>>
echo
查看>>
MariaDB,MySQL中存储过程的学习笔记
查看>>
一张图诠释linux系统启动过程
查看>>
载入jQuery库的最佳方法
查看>>