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 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文 ...
随机推荐
- hover设定触发时间间隔
500毫秒执行一次 $(".banner_menu_content li a").hover(function(){ var aa=$(this).text().trim(); s ...
- C程序设计教学小结（选择结构）
1. 函数使用的三个问题 函数声明语句 void add(); 或 int add(int x,int y); 函数调用 add(); c=add(a,b) 函 ...
- ngnix使用超时响应时间配置避坑一例
ngnix的超时响应时间配置得比tomcat的spring mvc响应时间还小,悲剧就发生了,生产环境还不易发现. 就好比定制固定木柜没考虑进门的尺寸,横竖斜都进不去,太悲剧了.哈哈哈,以此为鉴!~
- cxGrid导出Excel货币符号问题
cxGrid导出到Excel,对于Currency类型总是加上了货币符号,可以修改导出文件设置来去掉: 在cxXLSExport.pas文件中,修改: procedure TcxXLSExportPr ...
- Windows平台下面Oracle11.2.0.1 升级Oracle11.2.0.4 的简单步骤
1. 首先查看数据库的版本: 2. ESXi 上面的虚拟机挂在 oracle11.2.0.4的 iso磁盘 3. 执行set 进行升级 4. 安装选项进行选择 升级现有的数据库 5. 注意安装位置必须 ...
- python数据相关性分析 （计算相关系数）
#-*- coding: utf-8 -*- #餐饮销量数据相关性分析 计算相关系数 from __future__ import print_function import pandas as pd ...
- C-Lodop获取打印机列表Create_Printer_List
C-Lodop获取打印机列表Create_Printer_List,此方法Lodop不支持,是C-Lodop特有的函数,客户端本地打印单独用c-lodop,或集中打印等,可以获得本机或云主机的打印机列 ...
- Lodop在页面获取打印机列表 选择打印机预览
利用GET_PRINTER_COUNT,获取打印机个数,然后用GET_PRINTER_NAME(intPrinterIndex);循环获取打印机名称,添加到list列表里,可以让用户在页面就选择打印机 ...
- AJAX--总结
AJAX 2018-9-6 14:42:53 AJAX简介 HTTP协议------>HTTP权威指南 请求:客户端去向服务端请求一个文件 响应:服务端把对应的文件内容返回给客户端, ...
- 自学Zabbix11.4 Zabbix SNMP认证与加密配置 SNMPv3
点击返回:自学Zabbix之路 点击返回:自学Zabbix4.0之路 点击返回:自学zabbix集锦 自学Zabbix11.4 Zabbix SNMP认证与加密配置 SNMPv3 1. 增加snmp ...