笔记《精通css》第5章 链接应用样式
第5章 链接应用样式
1.链接伪类选择器
a : link{ } (寻找没有被访问过的链接)
a : visied{ }(寻找被访问过的链接)
动态伪类选择器
a : hover{ }(寻找鼠标悬停处的链接)
a : focus{ }(寻找通过键盘移动到的链接)
a : active{ }(寻找被激活的链接)
选择器的次序,次序混乱样式将不起作用
a : hover{ }
a : focus{ }
a : active{ }
a : link{ }
a : visied{ }
2.下划线,默认情况下链接有下划线
用属性
text-decoration : none(没有下划线)
text-decoration : underline(有下划线)
border-bottom : 1px dotted #000(黑点下划线)
border-bottom-style : solid(实线下划线)
font-weight : bold(链接加粗)
奇特链接下划线
textt-decoration : none;
background:url() repeat-x left bottom;(斜线下划线)
background-image:url( )(动画)
为链接目标设置样式
<a href="http;//XXXXXXXX#comment3">XXXXX</a>
.comment:target{background-color:yellow;}
3.给不同类型的链接加图标
外部链接样式
邮件链接样式
下载文档提示
4.按钮链接
修改a属性
display:block;
width:
line-height:
text-align:center;
下划线
边框
背景颜色
字颜色
5.css精灵
笔记《精通css》第5章 链接应用样式的更多相关文章
- 精通CSS 第1章
一 标记简史 1 使用有意义的元素 2 ID和类名:ID是唯一的,而一个类名可以应用于多个元素.在写ID和类名时需要注意区分大小写,并使用统一的命名约定,比如完全小写+连字符分割,例andy-budd ...
- 【笔记】css 自定义select 元素的箭头样式
原文链接:https://www.imooc.com/qadetail/187585?t=281881 最近项目需要自定义select 元素的样式,搜索了一下发现了通过设置select 元素 css ...
- 《精通CSS:高级Web标准解决方案》学习笔记(上)
鉴于国产CSS书籍基本都是辣鸡的现状,我在半年前动用某工作室的购书资金采购了一些技术书籍,这本广受好评的<精通CSS>也在其中.但是在阅读过后我深深的感觉到,如果说CSS本来已经是一种很琐 ...
- 《精通CSS》读书笔记(一)
最近新添16本书,目前开始看陈剑瓯翻译的<精通CSS——高级Web标准解决方案>(Andy Budd, CSS Mastery -- Advanced Web Standards Solu ...
- 精通CSS高级Web标准解决方案(4、对链接应用样式)
4.1 简单的链接样式 锚可以作为内部引用,也可以作为外部链接,应该区分对待. 伪类选择器: :link 用来寻找没有访问过的链接 :visited 用来寻找已经访问过的链接 a:link{color ...
- 【精通css读书笔记】 第八章 布局
学习了css布局的基础后又来翻阅<精通css>这本经典书籍,对布局有了进一步的认识. 基于浮动的布局 两列的布局仍然是使用一个元素向左浮动,一个元素向右浮动,值得注意的是要加入displa ...
- 朝花夕拾《精通CSS》三、对一些标签元素的使用
一.背景 翻出我4年前看的<精通CSS>一书,可惜当初没有整理读书笔记的习惯,最近又很少写前端,遂很多东西.知识点遗忘了,恰且现在 css 也有些变化和进步,遂一起打包整理,输出成几篇 b ...
- 朝花夕拾《精通CSS》二、选择器 & 层叠
一.背景 翻出我4年前看的<精通CSS>一书,可惜当初没有整理读书笔记的习惯,最近又很少写前端,遂很多东西.知识点遗忘了,恰且现在 css 也有些变化和进步,遂一起打包整理,输出成几篇 b ...
- 朝花夕拾《精通CSS》一、HTML & CSS 的基础
一.背景 翻出我4年前看的<精通CSS>一书,可惜当初没有整理读书笔记的习惯,最近又很少写前端,遂很多东西.知识点遗忘了,恰且现在 css 也有些变化和进步,遂一起打包整理,输出成几篇 b ...
随机推荐
- nyoj 63 小猴子下落
小猴子下落 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 有一颗二叉树,最大深度为D,且所有叶子的深度都相同.所有结点从左到右从上到下的编号为1,2,3,····· ...
- HDU 4906 (dp胡乱搞)
The Romantic Her Problem Description There is an old country and the king fell in love with a devil. ...
- (12)GrabCut前景提取
import cv2 import numpy as np import matplotlib.pyplot as plt img = cv2.imread('opencv-python-foregr ...
- Eddy's mistakes
Problem Description Eddy usually writes articles ,but he likes mixing the English letter uses, for ...
- AWR and ADDM
The Automatic Workload Repository Oracle collect a vast amount of statistics regarding the performan ...
- Python3基础(六) 深入list列表
正如Python FAQ1附录中说的, Python中任何值都是一个对象,所以任何类型(int.str.list-)都是一个类.而类就必然有它的方法或属性,我们要记下这么多类的所有方法显然是不可能的, ...
- iOS常用的正则表达式总结
/* 正则表达式说明: . 匹配除换行符以外的任意字符 \\w 匹配字母或数字或下划线或汉字 \\s 匹配任意的空白符 \\d 匹配数字 \\b 匹配单词的开始或结束 ^ 匹配字符串的开始 $ 匹配字 ...
- hihoCoder #1175 : 拓扑排序·二
[题目链接]:click here~~ 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描写叙述 小Hi和小Ho所在学校的校园网被黑客入侵并投放了病毒.这事在校内BBS上立马引 ...
- Java大数练习第二弹
hdu1250 水题 题目链接:pid=1250">http://acm.hdu.edu.cn/showproblem.php?pid=1250 import java.util.*; ...
- Magento 模块开发之DispatchEvent
在这一章节中.我们来了解 Magento 中的事件分发机制 Mage::dispatchEvent() 在创建自己的模块时, Event 事件的分发将会变成十分实用且有效 以个人的经验. 事件的分发使 ...