详解<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:< ...
随机推荐
- LeetCode----172. Factorial Trailing Zeroes(Java)
package singlenumber136; //Given an array of integers, every element appears twice except for one. F ...
- 【Prince2科普】Prince2七大主题之概论
[Prince2科普]Prince2七大主题之概论 PRINCE2的七大主题,就是项目管理中持续关注的七个方面,分别是: 1.商业论证 2.组织 3.质量 4.计划 5.风险 6.变更 7.进展 ...
- C++去掉字符串首尾的 空格 换行 回车
/* *去掉字符串首尾的 \x20 \r \n 字符 */ void TrimSpace(char* str) { ; char *end = str; char *p = str; while(*p ...
- sql2008 表名为全数字时查询报错
今天遇到个很奇葩的问题,在写一个应用程序时需要查询表的数据,但是表名是全数字的,直接查询会报错,于是想到给111的表名加一对中括号:即——>select * from [111] 刚开始还是报错 ...
- Linux架构
Linux架构 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 我以下图为基础,说明Linux的架构(architecture ...
- Web API开发实例——对产品Product进行增删改查
1.WebApi是什么 ASP.NET Web API 是一种框架,用于轻松构建可以由多种客户端(包括浏览器和移动设备)访问的 HTTP 服务.ASP.NET Web API 是一种用于在 .NET ...
- runtime运行机制方法学习
runtime这玩意第一次听说时都不知道是什么,经过了解后才知道它就是oc动态语言的机制,没有它那oc就不能称为动态语言.在之前可能大家对runtime了解都不深,随着编程技能的日益加深和需要,大家开 ...
- python decorator的理解
一.decorator的作用 装饰器本质上是一个Python函数,可以让其他函数在不做任何代码变动的前提下增加额外功能. 装饰器的返回值也是一个函数对象.python里函数也是对象. 它经常用于有切面 ...
- jquery中通过全局变量来禁止多次ajax请求
var ajaxstate=false;//定义全局变量,通过这个变量来获得当前的ajax状态 $(function(){ $(document).ajaxStart(function(){ $(&q ...
- Calendar.get()方法--- WEEK_OF_YEAR 、MONTH、
1. WEEK_OF_YEAR 一年中的第几周 由于西方的一周指的是:星期日-星期六,星期日是一周的第一天,星期六是一周的最后一天, 所以,使用 calendar.get(Calendar.WEE ...