Nginx 入门指南
HTML&CSS基础-选择器的优先级
作者：尹正杰
版权声明：原创作品，谢绝转载！否则将追究法律责任。
一.HTML源代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>选择器的优先级</title> <style type="text/css">
/**
* 选择器的优先级:
* 当使用不同的选择器，选中同一个元素并且设置相同的样式时，这样样式之间就会产生冲突,最终采取哪个选择器定义的样式，由选择器的优先级(权重)决定，
* 优先级高的优先显示;
* 当选择器中包含多种选择器时，需要将多种选择器的优先级相加然后再比较，但是选择器优先级计算不会超过他的最大的数量级,比如10个id选择器优先级权限相加最大不会超过1000，也就是相加后只有900.
* 如果选择器的优先级一样，则使用靠后的样式;
* 并集选择器的优先级是单独计算,如"div,p，#web,.hello{}"这是并集选择器，但计算优先级时单独划分计算的，并不会将所有的并集选择器的元素优先级相加。
* 可以在样式的最后，添加一个"!important",则此时样式将会获得一个最高的优先级，将会优于所有的样式显示，甚至优先级高于内联样式，但是在开发中尽量避免使用"!important",因为整个项目可能时多人协作开发，如果你写死了，有可能会出现别的开发人员怎么调整选择器均无法改变的显现。维护成本不太高；而且我们在开发中一般会使用js去修改html的样式，如果你在css中写死了发现js是改不掉的。
*
* 优先级的规则(数值越大代表优先级越高):
* 内联样式:
* 优先级为1000
* id选择器:
* 优先级为100
* 类和伪类：
* 优先级为10
* 元素选择器:
* 优先级为1
* 通配优先级(*):
* 优先级为0
* 继承的样式:
* 没有优先级
*
*/ p{
background-color: rosybrown;
} #web{
background-color: royalblue;
} p#web{
color: yellowgreen;
} *{
font-size: 50px;
} .hello{
color:blue ;
background-color: deeppink !important;
} .world{
color:yellow ;
} </style>
</head>
<body> <p class="hello world" id="web" style="background-color: yellow;">我是一个p标签
<span>我是p标签中的span标签</span>
</p>
</body>
</html>
二.浏览器打开以上代码渲染结果
Nginx 入门指南的更多相关文章
- 转：nginx入门指南，快速搭建静态文件服务器和代理服务器
本文介绍 Nginx 入门基础知识,让你迅速搭建 Nginx 服务器.主要内容包括 Nginx 安装和简单使用.Nginx的简单原理.Nginx 配置文件的结构.如何使用 Nginx 来提供静态文件服 ...
- nginx使用与配置入门指南
这是一篇关于nginx使用与配置的入门指南,但不包括nginx的编译与安装.我假定你知晓如何安装nginx.对大多数Linux系统来说,nginx都已经存在于它们的软件包里,直接使用系统提供的软件管理 ...
- ngnix 一 入门指南
翻译自:ngnix--Beginner Guide ##ngnix入门指南 本指南给出了nginx的基本介绍,并介绍了可以使用它的完成一些简单任务. 它假定nginx已经安装在读者的机器上. 如果不是 ...
- Nginx 入门学习教程
昨天听一个前同事说他们公司老大让他去研究下关于Nginx 方面的知识,我想了下Nginx 在如今的开发技术栈中应该会很大可能会用到,所以写篇博文记录总结下官网学习教程吧. 1. 什么是Nginx? 我 ...
- javaCV入门指南：序章
前言 从2016年6月开始写<javacv开发详解>系列,到而今的<javacv入门指南>,虽然仅隔了两年多时间,却也改变了很多东西. 比如我们的流媒体技术群从刚开始的两三个人 ...
- Docker 入门指南
Docker 入门指南 目录 基础概念 安装教程 基本操作 常用安装 构建操作 容器编排 壹.基础概念 什么是Docker? Docker是基于Go开发的应用容器引擎,属于 Linux 容器的一种封装 ...
- Web API 入门指南 - 闲话安全
Web API入门指南有些朋友回复问了些安全方面的问题,安全方面可以写的东西实在太多了,这里尽量围绕着Web API的安全性来展开,介绍一些安全的基本概念,常见安全隐患.相关的防御技巧以及Web AP ...
- Vue.js 入门指南之“前传”（含sublime text 3 配置）
题记:关注Vue.js 很久了,但就是没有动手写过一行代码,今天准备入手,却发现自己比菜鸟还菜,于是四方寻找大牛指点,才终于找到了入门的“入门”,就算是“入门指南”的“前传”吧.此文献给跟我一样“白痴 ...
- yii2实战教程之新手入门指南-简单博客管理系统
作者:白狼 出处:http://www.manks.top/document/easy_blog_manage_system.html 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文 ...
随机推荐
- 软件工程导论课后习题Github作业（把一个英文句子中的单词次序逆序，单词中字母正常排列）
Java源代码 package yly; import java.util.Scanner; public class ruanjian { public static void main(St ...
- opencv学习笔记（三）
imread()读入图,第一个参数,const string&类型的filename,填我们需要载入的图片路径名, 第二个参数,int类型的flags,为载入标识,它指定一个加载图像的颜色类型 ...
- MySql绿色版安装配置
首先从官网下载MySQL的安装文件:http://dev.mysql.com/downloads/file.php?id=456318(直接选择No thanks, just start my dow ...
- js选择排序。
<script> , , , , , , , ]; ; j<len; j++ ){ // 假设min为最小值 var minIndex = j; var min = arr[j]; ...
- Delphi2007卸载后无法再安装
Win7下卸载delphi2007后重新安装问题: 1.Delphi/C++ must be installed first 2.could not access network loacation/ ...
- jdk1.8 HashMap扩容原理详解
JDK1.7中,resize时,index取得时,全部采用重新hash的方式进行了.JDK1.8对这个进行了改善. 以前要确定index的时候用的是(e.hash & oldCap-1),是取 ...
- pyhon列表去重方法总结
开发中对数组.列表去重是非常常见的需求,对一个list中的id进行去重,有下面几种方法,前面两种方法不能保证顺序, 后面两种方法可以保持原来的顺序. 下面的代码都在Python3下测试通过, Pyth ...
- Luogu3676 小清新数据结构题（树链剖分+线段树）
先不考虑换根.考虑修改某个点权值对答案的影响.显然这只会改变其祖先的子树权值和,设某祖先原子树权值和为s,修改后权值增加了x,则对答案的影响为(s+x)2-s2=2sx+x2.可以发现只要维护每个点到 ...
- day14 闭包
闭包的概念 必须要有函数嵌套,内部函数调用外部函数的变量 简单的例子 此种方法会导致每次使用内部函数inner的时候需要不断的调用外部函数. 结果导致外部函数的变量不断的被调用被释放,比较低效,相当于 ...
- 自学Linux Shell9.4-基于Red Hat系统工具包存在两种方式之二：源码包
点击返回 自学Linux命令行与Shell脚本之路 9.4-基于Red Hat系统工具包存在两种方式之二:源码包 本节主要介绍基于Red Had的系统(测试系统centos) 1. 工具包存在两种方式 ...