网页主要由三部分组成：
CSS （Cascading Style Sheets） 层叠样式表，主要用于控制网页中的样式显示。一般css样式是作用在标签上，控制标签的显示样式。
层叠：css样式可以在多个地方书写，可以在标签上添加style属性添加css样式代码、style标签中书写的、外部css文件中书写css代码，层叠在一起，相同的css属性只作用一个，不同的直接作用，最终都执行形成一套css样式作用标签上。
样式表：指的就是css代码；页面上可通过内联样式、内部样式、外部样式三种方式添加css代码。
注意：所有的html标签默认是没有样式
在标签上添加style属性，在属性值中书写css样式代码
语法：
<p style="css属性1：css属性值1; css属性2：css属性值2；">
p>
好处：
哪里需要样式写在哪儿
缺点：
多个元素有相同的样式时，需要重复书写
在head标签中添加style标签，再通过选择器来书写css样式代码
语法：
<head>
<style>
选择器{
css属性1：css属性值1；
css属性2：css属性值2；
}
style>
head>
好处
缺点：
先创建一个后缀名为 .css文件，再里面通过选择器书写css样式代码，再在head标签中通过link标签引入css样式文件
语法：
<head>
<link rel="stylesheet" href="连接css样式文件">
head>
好处：
注意：优先级（权重大小）：内联权重最大，相同选择器，内部和外部采用就近原则，离标签越近的优先作用
相同选择器，后面的样式会盖住前面的样式
通过标签名找到指定的标签，没有指定范围，找到页面中所有的满足条件的标签
语法：
标签名{
css属性1：css属性值1；
css属性2：css属性值2;
}
又称为class选择器，通过标签上的class名找到满足条件的标签，多个标签可以共享一个class名，提取公共样式
语法：
.class名{
css属性1：css属性值1；
css属性2：css属性值2;
}
注意：
标签上可以作用多个class名，中间使用空格隔开
如果选择器多个组合在一起，中间没有空格，代表并且的意思
找到页面中class名中即有op又有oa的标签
.op.oa{
css样式代码
}
id是标签上定义的属性，id唯一，找到页面中唯一的一个标签，精准定位。
通过标签上的id名找到满足条件的标签
id命名规则：
语法：
#id名{
css样式代码
}
注意：id是唯一，以后通过js会操作标签上id名，id选择器慎用。
background-color:设置背景颜色
background-image：设置背景图片
background-image:url(连接背景图片的文件路径);
background-repeat:设置背景图片是否平铺
repeat:默认值，x轴和y轴都平铺repeat-x:x轴方向上进行平铺repeat-y：y轴方向上进行平铺no-repeat:不平铺background-position:设置背景图片的显示位置
background-size:设置背景图片的大小，css3提出
contain:一边铺满，另一边默认重复平铺cover:等比放大图片，两边都铺满，超出部分隐藏x轴 y轴：宽度 高度
background-attachment:设置背景图片是否固定（css3）
scroll:默认值，图片会随着滚动条滚动fixed:背景图片固定在页面上backgroud:复合属性
background: pink url(img/img-3.jpg) no-repeat 50% 50% /100px 100px fixed;
color:设置文本的颜色text-align：设置文本的对齐方式
line-height:设置文本的行高
text-decoration:设置文本修饰
none:无underline:下划线line-through:中划线，删除线overline:上划线letter-spacing:设置字符间距，一个中文就是一个字符，一个英文字母就是一个字符word-spacing:设置字间距，以文本中空格来区分text-indent:设置首行缩进text-transform:设置英文字母的大小写
通过display属性进行相互转化
取值：
display:inline;转为行内元素display:inline-block;转为行内块级元素display:block;转为块级元素diaplay:none;隐藏元素，元素会从页面在消失，页面重绘说明：本笔记根据网络视频教程整理。