css 有三种形式的写法：
- 直接在标签里写入style样式
- 在<head></head>里写入<style></style>样式
- 直接创建.css 文件通过<link/>引入css文件
<!--cc为名字，. 代表class-->
.cc{ color:red; font-size:18px; } .ccd{ color:#ddd; } 第一种 第二种 第三种 选择器 :
- 标签选择器
- 把HTML中‘所有’的a标签应用此样式
a{ color:red;} 2. 把input类中type=“text”的标签都应用这个样式
input[type="text"]{ background-color:black; color:white;} - ID选择器
例：id 是uu的标签应用这个样式
<div id="uu"> 我是谁我在哪儿 ？.？ </div>
#uu{ background-color:black; color:white;} - 层级选择器
例:
<div class='c'>
<a> <div> <span class='d'></span> </div> <span class = 'd'></span> </a> </div> <span class='d'></span>.c a div .d{ 此样式只应用于c样式的标签下的a标签下的div标签下的标签的d样式 (若省略div则是a标签下的所有d样式都被应用) 若a标签中有id=i8，则此处的css样式中的a可写为#i8} - 组合选择器
例 : 如下a样式和p样式可写为组合样式a,p{ }
a{}p{}a,p{ a标签或p标签都可以应用这个样式 也可以和层级选择器一起应用} <!--background-->
| background-color | 背景颜色 |
| background-image | 背景图片 |
| background-image：url("图片路径") | 如果没有指定图片宽度，图片默认会平铺；如果指定的高度大于图片高度，图片也会默认向下平铺 |
| background-repeat | repeat-x;不允许在x轴重复，repeat-y;不允许在y轴重复,no-repeat;不允许重复 |
| background-position：0px 119px; | 如望远镜，随着望远镜的移动看见的景物也不同 |
<!--border-->
线的粗细 实线虚线 线的颜色
<div style="border: 5px dotted #3D3127;"></div> dotted:虚线 solid : 实线border-left:左边框 border-right：右边框 border-top:上边框 border-bottom：下边框<!--display-->
参数：
| none | 隐藏标签 |
| block | 把块级标签变为内联标签 |
| inline | 把内联标签变为块级标签 |
<!--cursor-->
参数：
| pointer | 鼠标移动到标签变为小手 |
| move | 鼠标移动到标签变为十字拉拽 |
| url('图片路径') | 鼠标移动到标签变为图片 |
<!--float-->
float: left; right; 在层级标签中一旦子类标签被设置为float，则父标签将不会被撑起来了
解决方法一：
解决方法二：利用after，before伪类给内容前后插入数据
<!--position-->
参数：
| fixed | 固定位置 | 定位在窗口的某一位置，fixed-top 离'窗口'顶部距离; fixed-left 离左边距离; fixed-bottom 离下面的距离; fixed-right 离右边的距离 |
| absolute | 绝对位置 | 一次固定在窗口的指定位置和relative合用 |
| relative | 相对位置 | 本身不产生任何效果，和absolute合用 |
小例子:
<!--透明度:opacity-->
透明度可设置范围为：0-1，注：ie浏览器设置透明度用filter:alpha(opacity=sqlN)，其中sqIN设置范围：0-100
小例子：通过fixed固定设置两层div（注： <!-- z-index：层级数，数字越大层越上-->）
<!--边距padding-->
padding ： 内边距 // margin：外边距
padding: padding-left:左边距; padding-right:右边距; padding-bottom: 下边距; padding-top: 上边距;
margin: margin-left:左边距; margin-right:右边距; margin-bottom: 下边距; margin-top: 上边距;
padding参数设置的三种方式：
- padding：20px; 把上下左右边距都设置为20px;
- padding:10px 20px; 把上下边距设置为10px; 左右边距设置为20px;
- padding:10px 20px 30px 40px; 把上边距设置为10px; 把左边距设置为20px; 把下边距设置为30px; 把右边距设置为40px;
小例子：