控制超链接样式

链接的四种状态：

  • a:link - 普通的、未被访问的链接
  • a:visited - 用户已访问的链接
  • a:hover - 鼠标指针位于链接的上方
  • a:active - 链接被点击的时刻

去除CSS超链接下划线

a:link {text-decoration: none}

a{

  #取消所有样式

  text-decoration: none;

}

text-decoration还有以下几种取值：

  • none 默认。定义标准的文本。
  • underline 定义文本下的一条线。
  • overline 定义文本上的一条线。
  • line-through 定义穿过文本下的一条线。
  • blink 定义闪烁的文本。
  • inherit 规定应该从父元素继承 text-decoration 属性的值。

去掉下滑线，也就是将text-decoration的值设为 none；如果想要再加上下划线，那就将text-decoration值设为underline；还有其它的几种情况就自己试一下。

链接框

<!DOCTYPE html>

<html>

<head>

<style>

a:link,a:visited

{

display:block;

font-weight:bold;

font-size:14px;

font-family:Verdana, Arial, Helvetica, sans-serif;

color:#FFFFFF;

background-color:#98bf21;

width:120px;

text-align:center;

padding:4px;

text-decoration:none;

}

a:hover,a:active

{

background-color:#7A991A;

}

</style>

</head>

<body>

<a href="/index.html" target="_blank">click me</a>

</body>

</html>

CSS超链接样式，去除下划线等的更多相关文章

  1. css背景图片、隐藏、指针、垂直居中、去除下划线、缩进、列表类型

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  2. 通过css控制超链接不显示下划线

    “页面属性”——“链接”——“下划线样式”——“始终无下划线” <style type="text/css"> a:link { text-decoration: no ...

  3. 在HTML中怎么去掉a标签（超链接）的下划线？

    <style type="text/css">a:link,a:visited{ text-decoration:none; /*超链接无下划线*/}a:hover{ ...

  4. 纯css实现Magicline Navigation(下划线动画导航菜单)

    看别人网站的时候,看到一种导航菜单的动画,觉得很有意思,就仔细研究起来. 目前见过的动画有三种:水平下划线动画导航.水平背景动画导航.垂直动画导航,他们实现思路都是一样的,都是依赖 css3的同级通用 ...

  5. [HTML/CSS]导航栏的下划线跟随效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. css删除线，下划线等

    <style> .p1 { text-decoration:overline; //上划线 } .p2 { text-decoration:line-through; //删除线 }  . ...

  7. css给文字加下划线

    语法:linear-gradient(direction, color-stop 1, color-stop 2,……) 简单用法:background-image: linear-gradient( ...

  8. iphone 微信下浏览器中数字去除下划线

    在开发iphone应用程序的时候,safari下手机号码默认是有下划线的,通过下面的方法就可以去掉: <meta name="format-detection" conten ...

  9. css实现导航栏下划线跟随效果

    话不多说先附上代码 <style> ul li { float: left; display: block; list-style: none; margin-left: 20px; bo ...

随机推荐

  1. 从解决Cocos2dx-2.x arm64 Crash 来看C的奇技淫巧

    最近把以前做的老游戏拿出来,重新编到手机上来玩玩,然后就有了以下的经历. 那时的引擎还是Cocos2dx-2.x,iPhone5还是高档机型.现在的机器是这样的,iPhone6S Plus我自用,今年 ...

  2. vue相关坑

    1:vue 动态加载图片路径报错解决方法,循环遍历图片不显示图片 解决方法:https://www.cnblogs.com/qingcui277/p/8930507.html

  3. Mysql（Mariadb）慢查询日志中long_query_time 与log_queries_not_using_indexes与min_examined_row_limit 关系分析

    慢查询日志中long_query_time 与log_queries_not_using_indexes与min_examined_row_limit 关系分析   参数介绍: long_query_ ...

  4. vue的watch

    watch它可以用来监测Vue实例上的数据变动  尽量一张图解释清楚(尝试用圈圈区分关系): 写的很简单,watch本来就没啥东西我理解为响应式侦听全局变量 watch里绑定全局变量,被绑定全局变量发 ...

  5. Linux系统之LNMP及nginx反向代理实现

    1.编译安装LNMP,并安装wordpress 首先准备环境,编译安装LNMP可以是多台主机,也可以是单台主机,把nginx,mysql,php都集中安装在一个主机上:我这里以一台主机为例吧!! 一. ...

  6. 动态表单数据验证 vue

    idCard: [{ validator: (rule, value, callback) => { if (this.idCardVif === 'idCard') { this.valida ...

  7. CSS每日学习笔记（0）

    7.29.2019 1. CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解 ...

  8. 面试官：说说你对css效率的理解

    大家好,我是小雨小雨,致力于分享有趣的.实用的技术文章. 内容分为翻译和原创,如果有问题,欢迎随时评论或私信,希望和大家一起进步. 大家的支持是我创作的动力. 选择器的优先级 众所周知,选择器是有权重 ...

  9. Jsp el表达式无解析 解决

    需要开启 el isELIgnored="false" 这时已经可以正常访问了  

  10. JavaScript和JSCript的标准ECMAScript

    相信很多人都听过JavaScript(简称JS),甚至学过JavaScript.但是却没听过ECMAScript(简称:EC). ECMAScript其实是JavaScript的标准,也就是JavaS ...