css样式，重点 文本文字样式，背景，边框样式 了解盒模型

定位：position

 1.position:relative;相对定位
    在使用相对定位的情况下，不添加偏移量,定位元素不发生变换
     根据自身位置定位
              相对定位会占据原来位置，不脱离文档流和文本流
 2. position: absolute;绝对定位 
     绝对定位，脱离文档流跟文本流
      当没有父级或者父级没定位时，根据窗口定位 
      当父级有定位，根据父级定位 
 3.position:fixed固定定位 
     根据窗口定位，定位后就固定不动了 
     脱离文本流跟文档流 
 4.position:sticky粘性定位 
  粘性定位刚开始没达到阀值之前，在自己原来位置上，类似相对定位 
 当达到阀值时，变成固定定位，根据父级定位，没有父级根据窗口定位 
 5. position：static默认定位 
   默认定位就是根据普通流定位 

z-index 调层级，元素必须要有定位

文本文字样式

Css文字：

对齐方式：
text-align：justify，每一行被展开为宽度相等，左，右外边距是对齐
text-align：center（居中） right（右）left（左）
文本修饰：
text-decoration:none （删除链接的下划线）line-through（文字加删除线）underline（文字下划线）
文本转换：text-transform:uppercase（字母全部大写）
lowercase（字母全部小写）
Capitalize（字母首拼大写）
文字间隔：word-spacing：可以改变字（单词）之间的标准间隔
设置字体大小：font-size:
设置文字字体：font-family
设置文字行高：line-height: 50px;
文本缩进：text-transform: 2em;
text-shadow：水平阴影，垂直阴影，模糊的距离，以及阴影的颜色

CSS背景

background-color背景颜色
background-image 背景图片
背景图片属性：
background-repeat:repeat-x背景图片横铺
background-repeat:repeat-y背景图片竖铺
background-repeat:no-repeat背景图片不平铺
background-position（可以用百分数，长度值） 设置背景图像的起始位置:Top right  left buttom  ( 上，右，左，下)
background-size:cover 占满整个界面
							contain 背景尺寸

background-attachment设置背景 是否固定或者随着页面的其余部分滚动，可设定的值：
scroll	背景图片随页面的其余部分滚动。这是默认
fixed	背景图像是固定的
inherit	指定background-attachment的设置应该从父元素继承
local	背景图片随滚动元素滚动
background-position：center；背景定位，属性值有两位
background-clip:border-box 	位置从边框开始
background-clip:padding-box 位置从内填充开始
background-clip:contend-box 位置从内容开始

Css文本换行：

word-wrap:break-word;允许长文本换行
word-break: keep-all;单词拆分换行

边框样式

Css边框：

border;线宽，样式，颜色
border-style属性用来定义边框的样式
border-style 值:
none: 默认无边框
dotted: 定义一个点线框
dashed: 定义一个虚线框
solid: 定义实线边界
double: 定义两个边界。 两个边界的宽度和border-width的值相同
groove: 定义3D沟槽边界。效果取决于边界的颜色值
ridge: 定义3D脊边界。效果取决于边界的颜色值
inset:定义一个3D的嵌入边框。效果取决于边界的颜色值
outset: 定义一个3D突出边框。 效果取决于边界的颜色值
border-width：边框线宽
border-color：线的颜色
border;线宽，样式，颜色
box-shadow：盒阴影，水平位移，竖直位移，模糊度，颜色
border-image：设置图片边框

盒模型

盒子模型

Margin 跟padding属性值：
/* 属性值 *： 上下左右 /
/ 属性值 * *： 上下 左右 /
/ 属性值 * * *：上 左右 下 /
/ 属性值 * * * *：上 右 下 左 */
Auto 居中

Box-sizing：设置盒模型宽高
/* 标准盒模型宽=内容的宽度 /
/ 怪异盒模型宽=内容的宽度+内边距的宽（左+右）+边框线宽（左+右） /
/ box-sizing:content-box;默认 标准盒模型 /
/ box-sizing: border-box; 怪异模型 */
透明度设定： opacity:

盒阴影

在div中添加box-shadow	属性
例：div { box-shadow: 10px 10px 5px（模糊范围） ;}