CSS基础学习篇

1.1 样式表书写的位置




CSS是指层叠样式表，用来美化HTML










2.2 选择器




选择器{属性:值;  属性:值; }




2.3 基础选择器




标签{属性：值; }
特点：标签选择器定义之后，会将页面所有的元素都执行这个标签样式


2.4 类选择器


.自定义类名{属性:值;  属性:值; }


特点： 谁调用，谁生效。
       一个标签可以调用多个类选择器。
       多个标签可以调用同一个类选择器。
  ★类选择器命名规则
   ◎不能用纯数字或者数字开头来定义类名
   ◎不能使用特殊符号或者特殊符号开头（_）来定义类名
   ◎不建议使用汉字来定义类名
   ◎不推荐使用属性或者属性的值来定义类名
   


   
2.5 id选择器


#自定义id{属性:值; 属性:值;}




2.6 通配符选择器


*{属性:值;}


特点：给所有的标签都使用相同的样式。
★不推荐使用，增加浏览器和服务器负担




2.7 复合选择器


概念：两个或者两个以上的基础选择器通过不同的方式连接在一起


交集选择器：标签+类（ID）选择器{属性：值；}
后代选择器：选择器+空格+选择器{属性：值;}     特点：无限制隔代
子代选择器：选择器>选择器{属性:值;} 特点：选中直接下一代元素
并集选择器：选择器+，+选择器+，选择器{属性:值;}


3.1 文本元素




font-size:16px;  文字大小
Font-weight: 700 ;   值从100-900，文字粗细，不推荐使用font-weight:bold;
Font-family:微软雅黑;  文本的字体
Font-style: normal | italic;      normal 默认值  italic  斜体
line-height: 行高


文本属性连写：font: font-style font-weight  font-size/line-height  font-family;
◆：注意：
font:后边写属性的值。一定按照书写顺序。
文本属性连写文字大小和字体为必写项






3.2 文字的表达方式


◆直接写中文名称
.test{
font-family:微软雅黑;
font-size:12px;
}


◆写字体的英文名称
.test{
font-family:microsoft yahei;
font-size：12px;
}


◆unicode 编码
.test{
font-family:\5FAE\8F6F\96C5\9ED1;
font-size：12px;
}