详解<a>标签
相信对于学前端的人而言<a>标签并不陌生，我们先把他所有的属性列出来
一.主要属性
一般来说，a标签有着四种状态，分别是link,hover,active,visited，接下来我会仔细讲述这些状态
1. link 这是未访问的链接的状态，一般来说就是我们打开网页不进行任何操作时a标签的状态。
2. hover 这是鼠标划过链接出现的状态，比如字体变大变小 ，颜色变化之类。个人认为与js中onmouseover事件类似。
3. active 这是点击鼠标之后会出现的状态，但是是点击鼠标左键才会出现效果。个人认为与js中onclick事件类似。
4. visited 这是点击被鼠标访问过后出现的样式状态。
二.元素性质
<a>为行内元素，只可嵌套非a的inline类元素，比如我们最常用的<a href="#"><img src=" " alt=" "></a> -->图片链接。不可嵌套<div></div>.
因为a为行内元素，不能对他设置宽和高。
<head>
<title></title>
<style type="text/css">
a{
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<a href="#">abc</a>
</body>
由代码可看出我们对a设置了宽100px，高100px，但是我们看他的结构图
他是默认值的，所以设置宽高无效。
如果一定要对他设置一个宽 高，那么给他加一个属性 display：block，把他显示为块级元素即可。
a{
width: 100px;
height: 100px;
display: block;
}
详解<a>标签的更多相关文章
- meta标签详解(meta标签的作用)///////////////////////////转
meta标签详解(meta标签的作用) 很多人却忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧 ...
- 详解shape标签
转载自:http://blog.csdn.net/harvic880925/article/details/41850723 一.简单使用 刚开始,就先不讲一堆标签的意义及用法,先简单看看shape标 ...
- 详解meta标签
Meta标签详解,在网上转的,希望对大家有用 引言 您的个人网站即使做得再精彩,在"浩瀚如海"的网络空间中,也如一叶扁舟不易为人发现,如何推广个人网站,人们首先想到的方法无外乎以下 ...
- 百度MIP页规范详解 —— canonical标签
百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...
- html常用标签详解3-a标签
a标签 1.a标签的属性 a标签属于行内元素标签,双标签<a></a> href:a标签的跳转地址 target:打开方式(_self自身:_blank:新窗口) title: ...
- MyBatis的动态SQL详解-各种标签使用
MyBatis的动态SQL是基于OGNL表达式的,它可以帮助我们方便的在SQL语句中实现某些逻辑. MyBatis中用于实现动态SQL的元素主要有: if choose(when,otherwise) ...
- 网页设计：Meta标签详解
很多人忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧! META标签是HTML语言HEAD区的一个辅 ...
- html标签详解
html标签详解 <!DOCTYPE> 标签 <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前. <!DOCTYPE ...
- HTML5有语义的内联元素详解
HTML5有语义的内联元素详解 time标签 time 元素表示一个时间值,比如 5:35 P.M., EST, April 23, 2007.例如: Example Source Code:< ...
随机推荐
- [课程设计]Scrum 2.2 多鱼点餐系统开发进度（下单页面修复&美化）
[课程设计]Scrum 2.2 多鱼点餐系统开发进度 1.团队名称:重案组 2.团队目标:长期经营,积累客户充分准备,伺机而行 3.团队口号:矢志不渝,追求完美 4.团队选题:餐厅到店点餐系统WEB ...
- 【转】malloc与free的底层实现
本文转自:http://blog.163.com/xychenbaihu@yeah/blog/static/132229655201210975312473/ 如何查看进程发生缺页中断的次数? 用ps ...
- JAVA基础知识之网络编程——-网络通信模型（IO模型）
<Unix网络编程:卷1>中介绍了5中I/O模型,JAVA作为运行在宿主机上的程序,底层也遵循这5中I/O模型规则.这5中I/O模型分别是: 阻塞式IO 非阻塞式IO I/O复用 信号驱动 ...
- JAVA线程锁lock下Condition高级使用-多个Condition的整合使用
import java.util.concurrent.locks.Condition; import java.util.concurrent.locks.Lock; import java.uti ...
- [问题2015S03] 复旦高等代数 II（14级）每周一题（第四教学周）
[问题2015S03] 设 \(g(x)=x^n+a_1x^{n-1}+\cdots+a_{n-1}x+a_n\) 是数域 \(\mathbb{K}\) 上的多项式, \(V\) 是 \(\math ...
- 删除DSO Change Log表数据
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- java使用split切割字符串的时候，注意转义字符
今天在做项目的时候发现一个奇怪的问题 File file = new File("d:\\a.txt"); BufferedReader br = new BufferedRead ...
- CSS-浮动篇float
Float是一个强大的属性,但是它也会困扰我们如果我们不知道它的工作原理的话.这篇文章主要介绍float的原理和基本用法. 我们可以看到float在印刷世界的应用-杂志.很多杂志文章都是左边一个图片, ...
- java程序调用存储过程
java程序调用存储过程 PL/SQL子程序,很多情况下是给应用程序来调用的,所有我们要掌握使用其他编程语言来调用我们写好的存储过程.下面我们介绍下使用java调用Oracle的存储过程. ...
- sqlalchemy 优化count()……
一.sqlalchemy 中的count() count()统计数据特别慢: session.query(cls).count() 8W 数据花费了近50s 但是在数据库中直接查询: select ...