语法规则: 选择器{属性:值;} 样式书写方式: 外部样式: 1.创建一个独立的html样式,后缀为.html 2.创建一个独立的css样式,后缀为.css 3.关联 关联方式一: 在页面的head中添加 rel="stylesheet" 关联="层叠样式表" type="text/css" 类型="文本的/css样式" 常用选择器: 类型选择器(标签选择器):div a span img... 标签关键字{属性:值;} 类选择器(class选择器) <标签 class="name"></标签> .name{属性:值;} [注] 在同一个页面可以多次出现相同的值 在一个class中可以有多个值 具有重用性,通常用来写css样式 id选择器: <标签 id="name"></标签> #name{属性:值;} [注] 在一个页面中只有一个id值,不能出现相同的 在一个id中只有一个id值,具有唯一性,通常不用来写css样式 后代选择器: 选择器1 选择器2 选择器3{}找到1里面的2里面的3,最终找到的是3 选择器权重: id选择器 > 类选择器(class选择器) > 类型选择器 100 10 1 后代选择器权重:选择器权重之和 最高权重:!impormant 命名规范： 1：不能出现任何中文符号及特殊符号 2：可以使用英文字母，数字，下划线及美元符号组成，英文尽可能小写 3：不能以数字开头 4:驼峰命名法（匈牙利命名法） 小驼峰命名法:conBox 大驼峰命名法：ConBox 5：见名知意 6:不能使用一些关键字作为名字 常见css属性： 1.font-size：文本大小； px 12px 最小文本大小 16px 默认文本大小 2:color:文本颜色; y颜色单词：red green blue... 十六进制： #ffffff #ff0000 #000000 取值范围：# 0-9 a-f 三原色： rgb(0,0,0) rgba(0,0,0,0) r:red 取值范围：0-255 g：green 0-255 b:blue 0-255 a：alpha 透明度：0-1 3.width：宽度； 4.height；高度； 5.background：背景颜色； 6.background-image：url("背景颜色地址"); 【注】 背景图不能撑起元素的大小 默认重复 7.background-repeat：背景图是否重复； repeat 重复，默认值 no-repeat 不重复 8.background-size：宽度 高度； px % 【注】 两个值，分别表示宽度和高度 一个值，表示宽度，且高度将等比例缩放 9.background-position：水平 垂直；背景图定位 水平值：left center right 垂直值：top center right 【注】只给一个值，则另一边居中 px 【注】只给一个值，表示的是水平距离，且垂直将居中 可以为负数，表示相反的方向
