css属性

字体属性

font-family: "Microsoft Yahei", "微软雅黑", "Arial", sans-serif

 font-size: 14px;   #字体大小

font-weight    #字重
    normal   默认值，标准粗细  
    bold     粗体

 文本颜色

文字属性

text-align  #文字对齐方式
    left    左边对齐 默认值
    center    居中对齐
    justify    两端对齐

text-decoration   来给文字添加特殊效果。
    underline    定义文本下的一条线
    overline    定义文本上的一条线。
    line-through    定义穿过文本下的一条线。
    inherit        继承父元素的text-decoration属性的值。

 text-indent: 32px;     #首行缩进

 背景属性

/*背景颜色*/
background-color: red;
/*背景图片*/
background-image: url('1.jpg');
/*
 背景重复
 repeat(默认):背景图片平铺排满整个网页
 repeat-x：背景图片只在水平方向上平铺
 repeat-y：背景图片只在垂直方向上平铺
 no-repeat：背景图片不平铺
*/
background-repeat: no-repeat; 
/*背景位置*/
background-position: left top;
/*background-position: 200px 200px;*/
 background-attachment: fixed 将图片固定

 display属性

display:"none"与visibility:hidden的区别：

visibility:hidden: 可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说，该元素虽然被隐藏了，但仍然会影响布局。

display:none: 可以隐藏某个元素，且隐藏的元素不会占用任何空间。也就是说，该元素不但被隐藏了，而且该元素原本占用的空间也会从页面布局中消失。

 边框

border-width   #宽度
border-style   #样式
        none   无边框。
        dotted    点状虚线边框。
        dashed       矩形虚线边框。
        solid         实线边框。
border-color    #颜色
简写：
     border: 2px solid red;


border-radius设置为长或高的一半即可得到一个圆形。


box-shadow:5px 5px 2px 2px rgba(0,0,0,0.1);    /边框阴影/

浮动

标签只要一浮动就没有块儿级和行内标签一说了
id { 
    float: left 左边
           right   右边


消除浮动带来的影响
     .clearfix:after {
        content: '';
        display: block;
        clear: both;
    }

overflow溢出属性 

visible	默认值。内容不会被修剪，会呈现在元素框之外。
hidden	内容会被修剪，并且其余内容是不可见的。
scroll	内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto	如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
inherit	规定应该从父元素继承 overflow 属性的值。 

 定位（position）

static  >静态的(所有的标签默认都是static，就是所有的标签默认情况下是不能移动的)

relative（相对定位）  #相对与原来位置移动

absolute（绝对定位）    参照已经定位过的父标签进行移动(absolute)----->如果它没有父标签，相对于body标签
固定定位
	# 相对于浏览器窗口进行定位(fixed)
     #d4 {
            position: fixed;/*相对于浏览器窗口定位*/
            right: 30px;
            bottom: 50px;
        }

opacity

1. rgba
    # 只能对颜色进行透明
2. opacity
    # 它能够对颜色和字体进行透明

z-index

 设置对象的层叠顺序

1. z-index 值表示谁压着谁，数值大的压盖住数值小的，
2. 只有定位了的元素，才能有z-index,也就是说，不管相对定位，绝对定位，固定定位，都可以使用z-index，而浮动元素不能使用z-index
3. z-index值没有单位，就是一个正整数，默认的z-index值为0如果大家都没有z-index值，或者z-index值一样，那么谁写在HTML后面，谁在上面压着别人，定位了元素，永远压住没有定位的元素。
4. 从父现象：父亲怂了，儿子再牛逼也没用

 补充

text-indent:32px  //首行缩进，需要知道一个字体多大

background-regeat:no-repeat       //图片不铺满

img{max-width:100%}         //图片占头像框100%
box-shadow:spx,5px,5px,rgba(0.0.0.0.5)