如何去掉a标签的下划线
首先来了解下<a>标签的一些样式:
<a>标签的伪类样式
一组专门的预定义的类称为伪类,主要用来处理超链接的状态。超链接文字的状态可以通过伪类选择符+样式规则来控制。伪类选择符包括:
总: a 表示所有状态下的连接 如 a{color:red}
① a:link:未访问链接 ,如 a:link {color:blue}
② a:visited:已访问链接 ,如 a:visited{color:blue}
③ a:active:激活时(链接获得焦点时)链接的颜色 ,如 a:active{color:blue}
④ a:hover:鼠标移到链接上时 ,如 a:hover {color:blue}
一般a:hover和a:visited链接的状态(颜色、下划线等)应该是相同的。
前三者分别对应body元素的link、vlink、alink这三个属性。
四个“状态”的先后过程是:a:link ->a:hover ->a:active ->a:visited。另外,a:active不能设置有无下划线(总是有的)。
举例:伪类的常见状态值
- <style
type = “text/css”> - <!--
- a {font-size:16px}
- a:link {color: blue; text-decoration:none;} //未访问:蓝色、无下划线
- a:active:{color: red; } //激活:红色
- a:visited {color:purple;text-decoration:none;} //已访问:purple、无下划线
- a:hover {color: red; text-decoration:underline;} //鼠标移近:红色、下划线
- -->
- </style>
- <style type = “text/css”>
- <!--
- a {font-size:16px}
- a:link {color: blue; text-decoration:none;} //未访问:蓝色、无下划线
- a:active:{color: red; } //激活:红色
- a:visited {color:purple;text-decoration:none;} //已访问:purple、无下划线
- a:hover {color: red; text-decoration:underline;} //鼠标移近:红色、下划线
- -->
- </style>
如何去掉<a>的下划线:
对超链接下划线设置 使用代码"text-decoration"
语法:
text-decoration : none || underline || blink || overline || line-through
text-decoration参数:
none : 无装饰
blink : 闪烁
underline : 下划线
line-through : 贯穿线
overline : 上划线
去掉下划线的方法就是将其text-decoration设置为none即可。
如:<style>a{text-decoration:none}</style>
可以在此基础上发挥:如:<style>.myclass a{text-decoration:none}</style>
<style>div a{text-decoration:none}</style>
可以扩展至<a>标签的伪类:
a:link{text-decoration:none; cursor:pointer; color:red;}
a:visited{text-decoration:overline; cursor:pointer}
a:active{text-decoration:overline; cursor:pointer}
a:hover{text-decoration:overline; cursor:pointer}
.myclass:hover{text-decoration:overline; cursor:pointer}
<a>标签的一些属性
a标签是成对出现的,以<a>开始, </a>结束
属性.
Common -- 一般属性
accesskey -- 代表一个链接的快捷键访问方式
charset -- 指定了链接到的页面所使用的编码方式,比如UTF-8
coords -- 使用图像地图的时候可以使用此属性定义链接的区域,通常是使用x,y坐标
href -- 代表一个链接源(就是链接到什么地方)
hreflang -- 指出了链接到的页面所使用的语言编码
rel -- 代表文档与链接到的内容(href所指的内容)的关系
rev -- 代表文档与链接到的内容(href所指的内容)的关系
shape -- 使用图像地图的时候可以使用shape指定链接区域
tabindex -- 代表使用"tab"键,遍历链接的顺序
target -- 用来指出哪个窗口或框架应该被此链接打开
title -- 代表链接的附加提示信息
type -- 代表链接的MIME类型
如何去掉a标签的下划线的更多相关文章
- Visual Studio vs2010 去掉中文注释红色下划线;去掉代码红色下划线;
vs去掉下挂线也分两种: 1.去掉中文注释红色下划线,需要去掉VisualAssist下划线鸡肋功能: 1.选择Visual AssistX Options: 2.把如图所示的勾去掉,解决. 以后再次 ...
- html初始化页面和a标签无下划线
body, div, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dd, dt, img, form { padding:0px; margin:0px; b ...
- 如何让a标签的下划线去掉?
在css中添加 a{ text-decoration: none; }
- [原创]css中a标签去掉锚点文本下划线
我对博客的认识是:记录问题,解决问题,分享知识.如果有轮子,我不需要造轮子. 1.问题解决方式: 设置属性:text-decoration:none; 2.更多属性参数参考 text-decorati ...
- HTML-<a>标签添加下划线
<a href="ddrb/090630.asp" target="_blank" style="text-decoration:underli ...
- 去除a标签的下划线
a:link ,a:visited,a:hover,a:active { text-decoration: none;}
- a标签下划线
页面中有一处box中的a标签都被加上了下划线,查找元素却没有找到css中的underline. 原因是 <a>标签默认是有下划线的,而一般看到的<a>标签链接中的下划线都被覆盖 ...
- a标签去掉下划线
转载自:http://jingyan.baidu.com/article/a17d52853095838099c8f24e.html <a>是默认有下划线的.所以有时候为了美观,我们需要去 ...
- CSS 解决 a标签去掉下划线 text-decoration: none无效 的解决方案
经过查阅,如果想要去掉a标签的默认效果,就要用text-decoration: none;,但是经过试验发现并不好用,可能是因为你用a标签里的class或id定义的CSS样式,就像这样: <di ...
随机推荐
- 脱壳——修复加密IAT
脱壳--修复加密IAT 对两个练手程序进行脱壳修复加密IAT(其实是一个程序,只是用了几种不同的加壳方式) 第一个程序 Aspack.exe 下载链接:https://download.csdn.ne ...
- Redis系统学习之SpringBoot集成Redis操作API(集成SpringDataRedis及其分析)
SpringDataRedis调用Redis底层解读 在SpringBoot2.X之前还是直接使用的官方推荐的Jedis连接的Redis 在2.X之后换为了lettuce Jedis:采用直接连接,多 ...
- 4-socket套接字编程
socket套接字编程 目标:根据socket模块提供的接口函数,进行组合使用完成基于tcp或者udp的网络编程. 套接字:完成上述目标的一种编程手段,编程方案. 套接字分类: 流式套接字(sock_ ...
- 修改Android手机内核,绕过反调试
本文博客链接:http://blog.csdn.net/qq1084283172/article/details/57086486 0x1.手机设备环境 Model number: Nexus 5 O ...
- Linux中数据库的安装和配置(MySQL与Maria DB)
目录 MySQL和Maria DB的介绍 MySQL和Maria DB的安装 yum源安装MySQL(Centos6.5+Mysql5.1) 源码包安装MySQL yum源安装Maria DB 源码包 ...
- 重新封装了一下NODE-MONGO 使其成为一个独立的服务.可以直接通过get/post来操作
# 重新封装了一下NODE-MONGO 使其成为一个独立的服务.可以直接通过get/post来操作 # consts.js 配置用的数据,用于全局参数配置 # log.js 自己写的一个简单的存储本地 ...
- shell中的引号和转义
引号和转义 Bash 只有一种数据类型,就是字符串.不管用户输入什么数据,Bash 都视为字符串.因此,字符串相关的引号和转义,对 Bash 来说就非常重要. 转义 某些字符在 Bash 里面有特殊含 ...
- SSM整合大体步骤
SSM整合步骤: 1. 导入jar spring: springMVC: mybatis: 第三方支持:log4j,pageHelper,AspectJ,jackson,jstl 2. 搭建sprin ...
- Kafka源码分析(二) - 生产者
系列文章目录 https://zhuanlan.zhihu.com/p/367683572 目录 系列文章目录 一. 使用方式 step 1: 设置必要参数 step 2: 创建KafkaProduc ...
- HDU - 1789 Doing Homework again(贪心) ~~~学了一波sort对结构体排序
题目中因为天数和分数是对应的,所以我们使用一个结构体来存分数和截止如期. 一开始做这道题的时候,很自然的就想到对天数排序,然后天数一样的分数从大到小排序,最后WA了之后才发现没有做到"舍小取 ...