CSS基础

dunizb 发布于2019-04-23 13:32 / 3289人阅读

摘要：基本规则级联级联是浏览器决定应用哪一种样式的方法，它根据选择器的特指度以及规则集的出现次序起作用。特指度权重是选择器识别元素的精确性。选择器分类元素选择器伪元素选择器类选择器属性选择器伪类选择器选择器组合选择器否定选择器通用选择器

概述：

CSS全称Cascading Style Sheet，层叠样式表。
样式定义如何显示 HTML 元素。
外部样式表通常存储在 CSS 文件中。
多个样式定义可层叠为一。
浏览器从左往右解析选择器，用以加快浏览器的解析速度。

基本规则：

级联：

级联是浏览器决定应用哪一种样式的方法，它根据选择器的特指度以及规则集的出现次序起作用。
特指度（权重）是CSS选择器识别元素的精确性。为选取元素，需要计算特指度（a，b，c，d）。

（1）如果用style属性应用样式，则a=1，否则a=0。

（2）b为ID选择器的数量。

（3）c为类选择器、属性选择器和伪类选择器。

（4）d为类型选择器和伪元素的数量。

规则集顺序是一个CSS规则集在样式表中的位置，如果两个声明块中的选择器特指度相同，且它们为同一元素的某个属性应用样式，那么在样式表中处于相对靠后位置的声明块中的属性的优先级较高。

style属性的行内样式优先，否则特指度和规则集顺序决定什么元素应用什么样式。
!important声明可以覆盖级联样式。

选择器分类：

元素选择器：a{ }
伪元素选择器： ::before{ }
类选择器：.link{ }
属性选择器：[type=radio]{ }
伪类选择器：:hover{ }
ID选择器：#id{ }
组合选择器：[type=checkbox] + label{ }
否定选择器：not(.link){ }
通用选择器：*{ }

云服务器 GPU云服务器 css基础基础css css基础教程基础选择器css

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/2016.html

#WEB安全基础 : HTML/CSS | 文章索引

摘要：黑体本系列讲解安全所需要的和黑体安全基础我的第一个网页黑体安全基础初识黑体安全基础初识标签黑体安全基础文件夹管理网站黑体安全基础模块化黑体安全基础嵌套列表黑体安全基础标签拓展和属性的使用黑体安全基础嵌套本系列讲解WEB安全所需要的HTML和CSS #WEB安全基础 : HTML/CSS | 0x0 我的第一个网页 #WEB安全基础 : HTML/CSS | 0x1初识CSS #WEB安全基...

EscapedDog 2019-04-23 11:53 评论0 收藏0
关于CSS Reset 那些事（四）之构架CSS基础样式库

摘要：现在回到我们这一章节的标题，将它做下补充关于那些事四之基于构架基础样式库基础库构思为什么要做基础库我上一章节的末尾抛出了几个问题假设你要做一个游戏单页面，网页上并不存在表单内容，那么你就要移除一些冗余的代码，开始自定义样式来满足自己的需求。前言先来回顾一下前几章节，我们都说了哪些内容： CSS Reset 历史与 Normalize.css 介绍 Normalize.css...

mj 2019-08-28 18:13 评论0 收藏0
关于CSS Reset 那些事（四）之构架CSS基础样式库

摘要：现在回到我们这一章节的标题，将它做下补充关于那些事四之基于构架基础样式库基础库构思为什么要做基础库我上一章节的末尾抛出了几个问题假设你要做一个游戏单页面，网页上并不存在表单内容，那么你就要移除一些冗余的代码，开始自定义样式来满足自己的需求。前言先来回顾一下前几章节，我们都说了哪些内容： CSS Reset 历史与 Normalize.css 介绍 Normalize.css...

Yu_Huang 2019-08-01 14:48 评论0 收藏0
前端之CSS基础学习

摘要：上面五个问题就是我总结的基础概念，学习过程中一定要把它们弄明白别忘了有哦。请带着以下几个问题进行学习 CSS是什么 CSS的引用方式 CSS选择器 CSS优先级 CSS盒模型基础知识学习和实例演练教程 MDN中css教程CSS基础学习教程（css快速入门）CSS参考手册（便于了解更多css属性）CSS3教程（适用于移动端开发的css新特性）入门学习，一定要快，没有必要花大量时...

Hwg 2019-08-29 12:32 评论0 收藏0
前端菜鸟笔记 Day-3 CSS基础

摘要：派生选择器依据元素的位置关系来定义样式。称其为上下文选择器，称其为派生选择器。在现在布局中，选择器常常用于建立派生选择器。和一样，也可被用作派生选择器。文章大纲来源：【Day 3】HTML复习 + CSS基础初识CSS 入门CSS 初识CSS 层叠样式表（Cascading Style Sheets），即前端常说的CSS。内容引用：CSS 简介样式解决了什么问题？ HTML...

mingzhong 2019-08-30 15:55 评论0 收藏0