\(\color{Red}{首先设计一下静止的a标签}\)

a{
margin-right:10px;/*右边距,其他边距同理*/
border-bottom:1px solid #eec/*分别是下边框的粗,实线,颜色.左右边框等同理*/
text-decoration:none;/*默认有下划线,我们设置为none表示无*/
font-size:15px;/*字体大小*/
}

\(\color{Purple}{然后设计一下鼠标悬停在超链接上的变化}\)

a{
color:yellow;/*字体颜色*/
border:10px solid purple;/*和上面同理*/
background-color:#ccc;/*背景色*/
}

效果图------->>

还可以设置\(a:visited,a:active,\)这里不再累赘了

CSS设计超链接样式的更多相关文章

  1. 【CSS】使用CSS改变超链接样式

    超链接代码 <ahrefahref="http://www.divCSS5.com/"target="_blank" title="关于divC ...

  2. CSS超链接样式,去除下划线等

    控制超链接样式 链接的四种状态: a:link - 普通的.未被访问的链接 a:visited - 用户已访问的链接 a:hover - 鼠标指针位于链接的上方 a:active - 链接被点击的时刻 ...

  3. CSS 将按钮转成超链接样式

    一.将按钮转成超链接样式 .GoStyle    {         color: #0c5fc4;                   background-color: #FFFFFF;      ...

  4. 精通CSS+DIV网页样式与布局--页面和浏览器元素

    在页面和浏览器中,除了文字.图片.表格.表单等,还有很多各种各样的元素,在上篇博文中,小编主要简单的介绍了一下在CSS中如何设置表格和表单,今天小编主要简单介绍一下丰富的超链接特效.鼠标特效.页面滚动 ...

  5. (11)用css设计电子相册 {上}

    本篇学习资料讲解:       通过css对电子相册进行排版 和 侧面强调“盒子模型.标准流.浮动和定位”的重要性. 先来看看"双向联动模式"的电子相册图: {鼠标指针经过某张图片 ...

  6. 学习笔记 第七章 使用CSS美化超链接

    第7章  使用CSS美化超链接 学习重点 认识超链接 熟悉伪类 定义超链接样式 能够灵活设计符合页面风格的链接样式 7.1  定义超链接 在HTML5中建立超链接需要两个要素:设置为超链接的网页元素和 ...

  7. amazeui学习笔记--css(基本样式3)--文字排版Typography

    amazeui学习笔记--css(基本样式3)--文字排版Typography 一.总结 1.字体:amaze默认非 衬线字体(sans-serif) 2.引用块blockquote和定义列表:引用块 ...

  8. CSS重构:样式表性能调优

    这两天窝在家里又看了本CSS相关的书:<CSS重构:样式表性能调优>.重构是指在不改变代码行为的前提下,重写代码,使其更加简洁.易于复用. 这本书读起来比较快,可挑自己感兴趣的读,前面三章 ...

  9. CSS/CSS3常用样式小结

    1.强制文本单行显示: white-space:nowrap; 多行文本最后省略号: display: -webkit-box; -webkit-line-clamp:2; overflow: hid ...

随机推荐

  1. 逆拓扑排序 Reward HDU - 2647

    Reward HDU - 2647 题意:每个人的起始金额是888,有些人觉得自己做的比另一个人好所以应该多得一些钱,问最少需要花多少钱,如果不能满足所有员工的要求,输出 -1 样例1: 2 1 1 ...

  2. docker 安装vim和yum命令

    apt-get updateapt-get install vim -yapt-get install yum -y

  3. 前端学习笔记 --ES6新特性

    前言 这篇博客是我在b站进行学习es6课程时的笔记总结与补充. 此处贴出up主的教程视频地址:深入解读ES6系列(全18讲) 1.ES6学习之路 1.1 ES6新特性 1. 变量 2. 函数 3. 数 ...

  4. 读写SQL脚本进行创建表、视图和存储过程

    一.按照先创建表.视图.存储过程的顺序创建: 二.导出脚本的时候注意:保存为ANSI文本,选项中:if not exists为true,防止覆盖:包含说明性标头为false;use database为 ...

  5. L5语言模型与数据集

    本次实验使用的数据下载: jaychou_lyrics.txt 链接:https://pan.baidu.com/s/1LJSrkpV84YF61OPmjIHGIw 提取码:dj53 语言模型 一段自 ...

  6. Q - QQpet exploratory park HDU - 1493 (概率DP)

    题目大意: 一共有61个位置,标记为0~60.其中有10个重要位置,分别为:5, 12, 22, 29, 33, 38, 42, 46, 50 and 55. 有一个筛子,一共6个面,标有1~6.摇到 ...

  7. mapstruct使用详解

    我们都知道,随着一个工程的越来越成熟,模块划分会越来越细,其中实体类一般存于 domain 之中,但 domain 工程最好不要被其他工程依赖,所以其他工程想获取实体类数据时就需要在各自工程写 mod ...

  8. vue2.x学习笔记(十七)

    接着前面的内容:https://www.cnblogs.com/yanggb/p/12616847.html. 动态组件&异步组件 在前面学习组件基础的时候学习过动态组件,官方文档给出过一个例 ...

  9. 微信小程序基本知识

    逻辑实现 1 使用动态数据展示列表(可以考虑使用wx:for属性配合动态数组渲染全部列表项,以减少WXML页面的代码量) eg:  <view class='listGroup' wx:for= ...

  10. Neo4J 查找两节点之间的路径

    # 两节点之间的所有路径MATCH p=(a)-[*]->(b)RETURN p # a->b 直接连接MATCH p=(a)-[]->(b)RETURN p # a-...> ...