1.css 层叠样式表
2.css在html中的使用方式
2.1 在元素中添加style属性 <div style=“width:100px;height:100px;>”
2.2在head中添加style标签
2.3通过link 引入
3.css语法
选择器 {
样式名:样式值;
样式名:样式值;
}
4选择器
4.1核心选择器
标签选择器 div ul li
类选择器 .one
id选择器 #one
逗号选择器 div,#two
组合选择器 div.one
普遍学择期 * 一般不单独使用
4.2层次选择器
子代选择器 div > ul{}
后代选择器div ul{}
下一代兄弟选择器 .products > li + *{}
之后所有兄弟选择器 .products > li ~ {}
4.3 属性选择器
selector[]
input[placeholder] 选中有placeholder的input
input[type=text] 选中文本类型为text的input
input[type^=t] 第一个字母是t
input[type$=t] 最后一个字母是t
input[type=t] 中间有t
4.4伪元素选择器
::after
::before
::first-letter ::first-line ::selection
4.5 伪类选择器
4.5.1与状态相关
:link :hover :active :visited
4.5.2与子元素相关
:first-child :last-child :nth-child()
:first-of-type :last-of-type :nth-of-type
5选择器优先级
作用 当多的选择器选择同一个元素的同一个属性, 决定谁优先
因素 important最大
权重
style 1000
id 100
class 伪类 属性 10
元素 伪元素 1
顺序 当权重相同,声明在后面,优先级高
css基础介绍
最新推荐文章于 2023-08-18 20:40:23 发布