Web标准:五、超链接伪类

知识点:

1.链接的四种样式
2.将链接转换为块状
3.用css制作按钮
4.首字下沉
 
1)链接的四种样式
超链接有四个伪类,分别是:
a:link 未访问的链接
a:visited 已访问的链接
a:hover 鼠标移动到链接上
a:active 选定的链接
 
之所以称之为伪类,也就是说他不是一个真实的类,正常的类是以点开始,后面跟一个名称,而它是a开始后面跟一个冒号,再跟个状态限定字符。
 
text-decoration在HTML语言中对文本进行修饰,例如加下划线等。
取值:
none:默认值,无装饰
link:闪烁
underline:下划线
line-through:贯穿线
overline:上划线
 
说明:四个伪类必须按照固定顺序写,否则有些不会生效,顺序按照L(link)OV(visited)E H(hover)A(active)TE原则。
 
 
2)将链接转换为块级元素
链接在默认状态下是内联元素,转换为块级元素后可以获得更大的点击区域,可以设置高度和宽度,将链接转换为块级元素,只需增加一个display:block的css的属性即可。
 
3)用css制作按钮
这里的用css制作按钮,即在将链接转换为块级元素的基础上,给块级元素增加一个背景图片,这里我是用的本地的两个图片。
 
4)首字下沉
首字下沉需要应用伪元素:first-letter
 
注意:IE6如果想兼容first-letter,需要在选择符与样式花括号之间留有空格,否则IE6不能实现。即first-letter和{}中间留有空格。

Web标准:五、超链接伪类的更多相关文章

  1. web标准(复习)--5 超链接伪类

    今天我们开始学习超链接伪类,包含以下内容和知识点: 链接的四种样式 将链接转换为块状 用css制作按钮 首字下沉 一.超链接的四种样式 超链接可以说是网页发展史上一个伟大的发明,它使得许多页面相互链接 ...

  2. CSS(五):背景、列表、超链接伪类、鼠标形状控制属性

    一.背景属性 1.背景属性用来设置页面元素的背景样式. 2.常见背景属性 属性 描述 background-color 用来设置页面的背景色,取值如red,#ff0000 background-ima ...

  3. (五)CSS伪类(Pseudo-class)

    CSS伪类用于向某些选择器添加特殊的效果.伪类的语法如下: selector : pseudo-class {property: value} CSS类也可以与伪类搭配使用: selector.cla ...

  4. 【从0到1学Web前端】CSS伪类和伪元素

    1.CSS中的伪类 CSS 伪类用于向某些选择器加入特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 select ...

  5. 【从0到1学Web前端】CSS伪类和伪元素 分类: HTML+CSS 2015-06-02 22:29 1065人阅读 评论(0) 收藏

    1.CSS中的伪类 CSS 伪类用于向某些选择器添加特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 select ...

  6. 0013 CSS复合选择器:后代、子代、交集、并集、超链接伪类

    重点: 复合选择器 后代选择器 并集选择器 标签显示模式 CSS背景 背景位置 CSS三大特性 优先级 1. CSS复合选择器 目标 理解 理解css复合选择器分别的应用场景 应用 使用后代选择器给元 ...

  7. HTML(五)选择器--伪类选择器

    HTML代码 <body> <a href="www.baidu.com">www.baidu.com</a> </body> CS ...

  8. HTML超链接之伪类注意事项

    今天在复习html相关知识的时候发现了一个很常用,却经常被人们所忽略的知识点.那就是超链接伪类的使用.下面我就直接用代码来说明这一切. 伪类的相关代码 <!DOCTYPE html> &l ...

  9. web标准(复习)--6 html列表

    今天我们开始学习html列表,包含以下内容和知识点: ul无序和ol有序列表 改变项目符号样式或用图片定义项目符号 横向图文列表 浮动后父容器高度自适应 IE6的双倍边距bug 一.ul无序和ol有序 ...

随机推荐

  1. 【Spring学习笔记-5】Spring中的抽象bean以及bean继承

    *.hl_mark_KMSmartTagPinkImg{background-color:#ffaaff;}*.hl_mark_KMSmartTagBlueImg{background-color:# ...

  2. [转]OBJECT_ID 有哪些种类

    本文来自: http://www.cnblogs.com/biwork/archive/2013/01/07/2849311.html 特别是在建表建存储过程的时候进场会写到: IF OBJECT_I ...

  3. Vcenter 和ESXi License过期解决办法

    Vcenter License过期解决办法 用client连接vcenter:  KEY必须用vCenter Server 5 Standard序列号如果使用使用的“vCenter Server 5 ...

  4. git log --author详解,这个是个模糊匹配

    git log --author=authorname --author=<pattern>, commits whose author matches any of the given ...

  5. pandas的read_csv函数

    pd.read_csv(filepath_or_buffer, sep=',', delimiter=None, header='infer', names=None, index_col=None, ...

  6. Spring MVC 原生API

    原生API: Servlet环境中一些有用的对象: HttpServletRequest HttpServletResponse HttpSession Reader Writer InputStre ...

  7. CentOS 7.3 CDH 5.10.0 Druid0.12.4安装记录

    CentOS 7.3 CDH 5.10.0安装记录 0. 集群规划192.167.1.247 realtime247 realtime+hadoopdata192.167.1.248 broker24 ...

  8. Oracle中查询表的大小、表的占用情况和表空间的大小

    有两种含义的表大小.一种是分配给一个表的物理空间数量,而不管空间是否被使用.可以这样查询获得字节数: select segment_name, bytes from user_segments whe ...

  9. Java技术栈

    内容: 1.Java基础(JavaSE) 2.数据结构与算法与设计模式 3.计算机理论知识 4.数据库 5.Java web(JavaEE) 6.消息队列 7.Linux及服务器相关 8.分布式相关 ...

  10. 20180129周一之学习PYTHON笔记【PYTHON2写个自动点击学习功能】

    pyautogui.click(pyautogui.center(pyautogui.locateOnScreen('sy.png'))) #点击该截图一次 --------------------- ...