css

1.css

层叠样式表
css属性都是样式
css不能脱离html单独存在
    
    html搭建网页，木偶
    css 美化页面 ，木偶化妆
    js  动态效果，让木偶动起来  dom

2.特点

 1.css不能脱离html单独存在
 2。大小写敏感
 3.从上到下依次解析
 4.没有容错性

3.基础语法

1.设置样式 
    属性名和属性值用冒号隔开
    多对属性之间用分号隔开
    最后一对可不加分号
2.如何将css用到html上
    1.行内样式
        style属性
    2.内联样式
        style标签中
    3.内部引入
        建议使用link 
            link标签
        @import url 先加载html 
    优先级
        行内样式>内联=外部引入
        就近原则  谁更靠近元素谁优先级更高
3.注释
    不能嵌套使用
    /*注释*/

4.选择元素

选择器

id选择器
    #value 
class选择器
    .value
元素选择器
    标签名称
*
后代选择器/层次选择器
    空格  所有子元素包含孙代
    >     所有子元素不包含孙代
兄弟选择器
    +  
    ~
组合选择器
多选择
属性选择器
    [class] 
伪类选择器
    ：伪类名称
    ：first-chlid
    ：last-chlid
    ；nth-chlid（num /odd/even）
    :link
    :hover
    :active
    :


伪元素选择器               
    ::为元素名称
    插入行内元素
    ；；first-line
    ；；first-letter
    ；；before
        content：''/url()设置图片
    ；；after
    ；；select

选择器优先级
    ！important 优先级最高
    特性值 
        特性值越大 优先级越高
        特性值相同 采用就近原则
        原则
    基础值
        style 1000
        id 100
        class /伪类/元素 10
        元素/伪元素1

5.设置样式

1.盒子模型
    content+padding+

    默认盒子：

        特点
            width 设置给content
            盒子宽度 content +padding+border
    
    边框盒子/ie盒子
        box-sizing：border-
        特点
            width 设置给盒子宽度

2.样式
    文本样式
        
        fontwasome
        iconfont
    列表样式
        list-style 
        list-style-xxx
    边框样式

        border-left：width  style color
        border ：width style color

    背景样式
        background：
            -size 
            -repeat
            -image
            -position

6.布局