相信对于学前端的人而言<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>标签的更多相关文章

  1. meta标签详解(meta标签的作用)///////////////////////////转

    meta标签详解(meta标签的作用) 很多人却忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧   ...

  2. 详解shape标签

    转载自:http://blog.csdn.net/harvic880925/article/details/41850723 一.简单使用 刚开始,就先不讲一堆标签的意义及用法,先简单看看shape标 ...

  3. 详解meta标签

    Meta标签详解,在网上转的,希望对大家有用 引言 您的个人网站即使做得再精彩,在"浩瀚如海"的网络空间中,也如一叶扁舟不易为人发现,如何推广个人网站,人们首先想到的方法无外乎以下 ...

  4. 百度MIP页规范详解 —— canonical标签

    百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...

  5. html常用标签详解3-a标签

    a标签 1.a标签的属性 a标签属于行内元素标签,双标签<a></a> href:a标签的跳转地址 target:打开方式(_self自身:_blank:新窗口) title: ...

  6. MyBatis的动态SQL详解-各种标签使用

    MyBatis的动态SQL是基于OGNL表达式的,它可以帮助我们方便的在SQL语句中实现某些逻辑. MyBatis中用于实现动态SQL的元素主要有: if choose(when,otherwise) ...

  7. 网页设计：Meta标签详解

    很多人忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧! META标签是HTML语言HEAD区的一个辅 ...

  8. html标签详解

    html标签详解   <!DOCTYPE> 标签 <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前. <!DOCTYPE ...

  9. HTML5有语义的内联元素详解

    HTML5有语义的内联元素详解 time标签 time 元素表示一个时间值,比如 5:35 P.M., EST, April 23, 2007.例如: Example Source Code:< ...

随机推荐

  1. Script 简单语句的练习题

    猜拳 <body>请输入剪刀或者石头或者布:<br /><input type="text" id="A"/><inp ...

  2. Linux常见命令汇总

    1.rz sz上传下载 若未安装使用:yum install lrzsz 安装 上传: rz 覆盖上传: rz -y 下载: sz bbb.jpg

  3. (5) 深入理解Java Class文件格式(四)

    转载:http://blog.csdn.net/zhangjg_blog/article/details/21658415 前情回顾   在上一篇博客深入理解Java Class文件格式(三) 中, ...

  4. 使用phantomjs操作DOM并对页面进行截图需要注意的几个问题

    phantomjs是一个无界面浏览器,可用于网页截图和前端自动化测试,基于webkit内核(也就是chrome使用的内核),并使用js编写业务脚本来请求.浏览和操作页面.最近前端监控需要用到phant ...

  5. 安装了ubuntu14.04+windows7双系统的笔记本启动后出现grub rescue>提示符

    解决思想如下: 1.在grub rescue>提示符处输入ls  即可看到该命令列出了硬盘上的所有分区,找到安装了linux的分区,我的安装在(hd0,msdos8)下,所以我以(hd0,msd ...

  6. jquery总结03-遍历节点

    这是用的最多的 向下遍历节点 children()   第一级子元素 相当于li>span find()  多级子孙元素 相当于li span 注意:.filter(':contains(&qu ...

  7. 《BI那点儿事》数据流转换——逆透视转换

    逆透视转换将来自单个记录中多个列的值扩展为单个列中具有同样值的多个记录,使得非规范的数据集成为较规范的版本.例如,每个客户在列出客户名的数据集中各占一行,在该行的各列中显示购买的产品和数量.逆透视转换 ...

  8. Android 检查手机网络是否可用

    添加网络状态权限 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/> 代 ...

  9. Deep Learning 9_深度学习UFLDL教程：linear decoder_exercise（斯坦福大学深度学习教程）

    前言 实验内容:Exercise:Learning color features with Sparse Autoencoders.即:利用线性解码器,从100000张8*8的RGB图像块中提取颜色特 ...

  10. DOS批处理不支持将UNC 路径作为当前目录的巧妙解决方案

    DOS批处理不支持将UNC 路径作为当前目录的巧妙解决方案在有些时候,需要在批处理中操作UNC目录,但批处理并不能直接对UNC目录进行操作,怎么办? 废话少说,直接上代码,打开网上邻居→整个网络→Mi ...