css基础2

CSS的属性设置
    1.背景属性设置
    2.文本属性
    3.字体属性设置
        font-family:指定一个元素的字体样式【黑体  宋体....】
        font-size:用于设置字体大小
        font-style:指定文本的字体倾斜
        italic--设置倾斜【正常字体】
        oblique---设置倾斜【非正常字体】
        normal---什么都有
italic 和 oblique 的区别：
一种字体有粗体、斜体、下划线、删除线等诸多属性。但是并不是所有字体都做了这些，一些不常用的字体，或许就只有个正常体，如果你用 italic，就没有效果了。这时候你就要用 oblique，可以理解成 italic 是使用文字的斜体，oblique 是让没有斜体属性的文字倾斜！

       font-weight：设置文本的粗细
       单词设置：bold  lighter  normal
       数字：整百{100~900}

4.超链接样式使用的是伪类

a:link{}：正常，未被访问过的超链接

a:hover{}：当用户鼠标放在链接上时

a:active{}：链接呗点击的那一刻

a:visited{}：用户已经访问过的链接

5.列表属性设置

list-style-type：设置列表项标记的内容

            none【无】 disc【实心圆】 circle【空心圆】 square【实心方块】 decimal【数字】 lower-roman【小写罗马数字】upper-roman【大写罗马数字】lower-alpha【小写英文字母】 upper-alpha【大写英文字母】
list-style-image：使用图像来替换列表项的标记
list-style-image：url('');
list-style-position:指示如何相对于对象的内容绘制列表项标记    
inside---包含列表标记
outside---不包含列表标记

6.表格属性设置
        border属性：设置表格边框        
        border-collapse：属性设置表格的边框是否被折叠成一个单一的边框或隔开
        width和height属性定义表格的宽度和高度
        text-align属性设置水平对齐方式，向左，右，或中心
        vertical-align属性设置垂直对齐方式，顶部，底部或中间
        padding控制边框和表格内容之间的间距，应使用td和th元素
        background-color设置背景颜色

7.边框属性设置
        CSS边框属性允许你指定一个元素边框的粗细，样式【实线，虚线，双实线】，颜色
        1.border：粗细，样式【实线，虚线，双实线】，颜色【元素的4边相同样式】
        2.border-width:边框粗细 / border-style:样式 / border-color:颜色
        3.border-top-width:边框粗细 / border-top-style:样式 / border-top-color:颜色
           border-right-width:边框粗细 / border-right-style:样式 / border-right-color:颜色
           border-bottom-width:边框粗细 / border-bottom-style:样式 / border-bottom-color:颜色
           border-left-width:边框粗细 / border-left-style:样式 / border-left-color:颜色
        4.border-top:粗细，样式【实线，虚线，双实线】，颜色
           border-right:粗细，样式【实线，虚线，双实线】，颜色
           border-bottom:粗细，样式【实线，虚线，双实线】，颜色
           border-left：粗细，样式【实线，虚线，双实线】，颜色

CSS盒子模型
        所有HTML元素可以看作盒子
        外边距---元素与元素之间的距离
        边框粗细---边框的薄厚
        内边距-----边框与内容之间的距离
        盒子的内容--当前元素的内容
        计算一个元素的宽高：
        元素的宽度=内容宽度+左内边距+右内边框+左边距+右边框+左外边距+右外边距
        元素的高度=内容高度+上内边距+下内边框+上边距+下边框+上外边距+下外边距
    
    8.外边距---当前元素与其他元素之间的距离
        margin属性来设置外边距
        1.单独改变元素的上，下，左，右外边距：
           margin-top  margin-right  margin-bottom margin-left
        2.一次改变上，下，左，右外边距
            margin：数字1;[上，下，左，右外边距相等]
            margin：数字1 数字2;
                [数字1--上，下外边距相等]
                [数字2--左，右外边距相等]
            margin：数字1 数字2 数字3;
                [数字1--上外边距]
                [数字2--左，右外边距相等]
                [数字3--下外边距]
            margin：数字1 数字2 数字3 数字4;
        设置外边距的数字可以是负整数。【消除元素与body之间的默认缝隙】

9.内边距【填充】---设置的是元素内容与元素边框之间的距离
        padding属性来设置内边距【填充】
        1.单独改变元素的上，下，左，右内边距【填充】：
            padding-top  padding-right  padding-bottom  padding-left
        2.一次改变上，下，左，右内边距【填充】
            padding：数字1;[上，下，左，右内边距【填充】]
            padding：数字1 数字2;
                [数字1--上，下内边距【填充】相等]
                [数字2--左，右内边距【填充】相等]
            padding：数字1 数字2 数字3;
                [数字1--上内边距【填充】]
                [数字2--左，右内边距【填充】相等]
                [数字3--下内边距【填充】]
            padding：数字1 数字2 数字3 数字4
        设置父元素的padding会撑开当前的父元素

9.尺寸设置
        width属性设置元素的宽度。
        height属性设置元素的高度。
        line-height 属性设置行高。
    10 Display(显示) 与 Visibility（可见性）