详解<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----202. Happy Number(Java)
package isHappy202; /* * Write an algorithm to determine if a number is "happy". A happy n ...
- 用andtoid studio获取天气数据并解析适配
1.申请拿到数据 可以用“聚合数据” 2.在android studio中导入需要的jar包 复制—>app—>libs—>粘贴—>右击—>Add As Library… ...
- Python学习笔记-常用模块
1.python模块 如果你退出 Python 解释器并重新进入,你做的任何定义(变量和方法)都会丢失.因此,如果你想要编写一些更大的程序,为准备解释器输入使用一个文本编辑器会更好,并以那个文件替代作 ...
- 第十二天 jni 了解
1 .什么是jni java native interface 是一种协议. 用于java 和C 语言之间进行 通讯. 2. java 8中基本类型 . byte (1个字节) short ...
- jquery总结05-常用事件04-委托事件
委托事件on 多个事件绑定同一个函数 $("#elem").on("mouseover mouseout",function(){ });通过空格分离,传递不同 ...
- mac 激活Ultra Edit16
一.文本编辑器UltraEdit 参照Ultra Edit16.10 Mac 破解下载,或者官方下载 Ultra Edit16即可 printf of=/Applications/UltraEdit. ...
- java练习题：输出100以内与7有关的数、百马百担、打分（去掉最高、最低分）、二分法查找数据
1.输出100以内与7有关的数 注: 这些数分为三类:(1)7的倍数,(2)个位数字是7的数,(3)十位数字是7的数 int i=1; System.out.println("输出100以内 ...
- 与Status Bar和Navigation Bar相关的一些东西
Android Navigation Bar Status Bar 与StatusBar和NavigationBar相关的东西有两种,一是控制它们的显示与隐藏,二是控制它们的透明与否及背景. 在2 ...
- 浅谈 Android 自定义锁屏页的发车姿势
作者:blowUp,原文链接:http://mp.weixin.qq.com/s?__biz=MzA3NTYzODYzMg==&mid=2653577446&idx=2&sn= ...
- [教程] 离线封装原版WIN7系统 100%纯净
raymond 发表于 2015-11-28 18:54:15 https://www.itsk.com/thread-360376-1-4.html 对于之前我用母盘封装的系统,纯粹是为了体积而折腾 ...