问题:请指出以下结构中,A标签内的字体颜色。

<style>

a{ color:#ccc}/* 灰色 */

.alink a{color:#F60}/* 橙色 */

h1 a{color:#F00}/* 红色 */

a:link{color:#009}/* 蓝色 */

div h1 a{ color:#000}/* 黑色*/

</style>

<div id="contact">

  <h1 class="alink">

    <a href="#">这里是文字内容</a>

  </h1>

</div>

正确答案:蓝色

其实验证方式很简单,运行一下就可以知道了。

.alink a和a:link其实优先级是一样的,哪一个定义在后面,就显示哪一个的颜色;

网上有一段判断优先级的方法:

    内联样式(1000)> ID(100)> CLASS(10)> DIV(1)>*(0)

简单解释一下就是,内联样式的优先级高于ID,ID高于class,class高于标签,标签高于通配符;

括号里是具化了一下选择符所代表的权重,然后计算该选择符的个数总和,按照权重相加,哪一组样式的总值大,那么优先级就最好。

(这里没有说 !important,因为他是最高级喽~~~)

选择符优先级-----:link伪类的更多相关文章

  1. HTML/CSS 选择符优先级

    CSS的选择符优先级 1.同级样式默认后者覆盖前者 2.样式优先级 类型(1) < class[type](10)=伪类(10) < id(100) < style行间样式(1000 ...

  2. 李洪强和你一起学习前端之(5)css书写位置 优先级和伪类

    亲爱的,时间过得真快,不知不觉我们一起学习前端已经4天了,这4天的时间里,我们是不是收获很大呢,每当我们学习一个新的知识点的时候,每当我们做出一个新的东西来的时候,我们是不是欣喜若狂,世界从来否不会辜 ...

  3. HTML+CSS教程(五)外联样式、组选择器、圆角边框、样式优先级、伪类、盒子模型、元素溢出

    一.外联样式 通过link标签引入外部css文件夹中的xxx.css文件到head标签中 例: 二. 1.组选择器 选择器名称1,选择器名称2,选择器名称3,…{属性:属性值;属性;属性值} 例: & ...

  4. 学习CSS记录:选择符优先级

    1.标有!important 关键字声明属性. 2.HTML中的CSS样式属性. 3.作者编辑的CSS文件模式属性. 4.用户设置的样式. 5.浏览器默认的样式. ------------------ ...

  5. css选择符优先级

  6. css3选择符

    常用的选择符 1.元素选择符 2.id选择符 3.class选择符 4.通配符 5.群组选择符 6.包含选择符 7.伪类选择符(伪类选择符CSS中已经定义好的选择器,不能随便取名) 8.伪对象选择符( ...

  7. CSS(二)选择符

     2019-04-11 22:14:23 1.类型选择符(标签选择符)  html中所有的标签都可以直接对元素选择  p em i a html body.....   特点:对页面中所有当前类型的元 ...

  8. CSS3 选择器——笔记+实战案例(基本选择器、组合选择器、属性选择器、伪类选择器)

    使用CSS3 选择器——笔记 CSS通过选择器控制HTML元素,CSS选择器对网页对象可以实现一对一.一对多或者多对一的匹配. 一.CSS3选择器分类 CSS选择器在CSS2.1选择器的基础上新增了属 ...

  9. before伪类的超有用应用技巧——水平菜单竖线分隔符

    方法一.li前面加before伪类 <!doctype html> <html dir="ltr" lang="zh-CN"> < ...

随机推荐

  1. 深入浅出ES6(十三):类 Class

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 你可能觉得之前讲解的内容略显复杂,今天我们就讲解一些相对简单的内容,不再是生成器 ...

  2. ExtJs之Ext.query

    <!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv ...

  3. kafka配置

    官网:http://kafka.apache.org/ 主要有3种安装方式: 1. 单机单broker 2. 单机多broker 3. 多机多broker 1. wget http://mirror. ...

  4. 【poj1061-青蛙的约会】拓展欧几里得-不定方程

    http://poj.org/problem?id=1061 题意:裸题.注意负数. //poj1061 #include<cstdio> #include<cstdlib> ...

  5. JavaWeb项目开发案例精粹-第6章报价管理系统-03Dao层

    1. package com.sanqing.dao; import java.io.Serializable; import java.util.LinkedHashMap; import com. ...

  6. android-exploitme(七):高级加密

    在上一个议题上我们解释了为什么不能把信息明文保存在设备上,应该加密,那么加密就是安全的吗? 下面来看一下, 编译BasicEncryptionSolution.apk,安装

  7. Qt之图形(Source和Dest相互覆盖的取舍,真的很方便)

      源码 ... painter.drawImage(0, 0, destinationImage); painter.setCompositionMode(QPainter::Composition ...

  8. DB2中字符、数字和日期类型之间的转换

    DB2中字符.数字和日期类型之间的转换 一般我们在使用DB2或Oracle的过程中,经常会在数字<->字符<->日期三种类 型之间做转换,那么在DB2和Oracle中,他们分别 ...

  9. Sqlstate解释

    本篇文章主要介绍了"Sqlstate详解",主要涉及到方面的内容,对于DB2感兴趣的同学可以参考一下: 根据 X/Open 和 SQL Access Group SQL CAE 规 ...

  10. MyBatis学习总结_07_Mybatis缓存

    一.MyBatis缓存介绍 正如大多数持久层框架一样,MyBatis 同样提供了一级缓存和二级缓存的支持 一级缓存: 基于PerpetualCache 的 HashMap本地缓存,其存储作用域为 Se ...