2021-7-14 CSS页面设计的学习

CSS的学习
一．CSS的概念和作用
C cascading:级联
S style：样式
S sheet：表单
作用：用于进行网页风格设计
CSS样式具有继承性，子标签默认会继承父标签的样式

二．CSS语法
选择器 {属性:值;属性:值;…}
例如：h1{color:red;font-size:14px;}
这行代码可以将h1标题的字体颜色改为红色，大小修改为14px;

三．基本选择器
（1）标签选择器
Html标签 {属性:值;属性:值;…}
例如 p{color red;}
（2）类选择器
类名称 {属性:值;属性:值;…}
例如：.class{color:red;font-size:14px;}
（3）ID选择器
#Id名称 {属性:值;属性:值;…}
例如：#id{color:red;font-size:14px;}
三种基本选择器之间的优先级：id选择器>类选择器>标签选择器

四．复合选择器
（1）后代选择器
父类标签 子类标签{属性:值;属性:值;…}
例如：h1 span{font-size:50px;}
（2）并集选择器
标签，标签{属性:值;属性:值;…}
h1,h2{color:gray;}
（3）全局选择器
*{属性:值;属性:值;…}

三种样式表：行内样式：写在标签内部，使用type=””;
内嵌样式：写在head之中，使用
外部样式：写在外部css文件之中，使用
三种样式表之间的优先级：行内样式>内嵌样式>外部样式

CSS中的一些标签：
Color:颜色
Text-decoration：underline;加下划线
Font-weight:bold;字体加粗
Width:宽度
Height:高度
Margin-方位：定位
Display:inline设置行内块
Border:边框大小 solid 边框颜色
padding设置内边距
Margin设置外边距