HTML基础（CSS属性）

        一、文本与字体属性

            1.字体段落相关属性

                color:字体颜色

                font-size:字体大小

                text-align:对齐方式（水平居中）

                    center:居中

                    left；左对齐

                    right:右对齐

                    justify:两端对齐

                    inherit:继承父元素

                注意：text-align：justify仅用于除最后一行的文本对齐，要使最后一行两端对齐，需加一行代码text-align-last：justify

                line-height:行高

                    垂直居中：行高=盒子高

                list-style：li样式

                    none：取消默认样式

                text-indent：文本（首行）缩进

                    缩进n个字符，值等于字体大小*n

                text-decoration：设置或删除文本装饰(不继承)

                    none：标准文本，清除a标签默认下划线

                    underline：下划线

                    overline：上划线

                    line-through：删除线

                    blink：设置文本闪烁

                    inherit：继承父元素

                        eg：a:hover{

                            text-decoration:underline

                        }

                text-tranform:文本转换

                    作用：指定文本中的大小写字母

                    capitalize：单词首字母大写

                    uppercase：大写所有字母

                    lowercase：小写所有字母

                    inherit：继承父元素

                    word-spacing：文本间隔，用于中文字，英文单词

                    letter-spacing：文本间隔，用于中文字和英文字母

                    white-spacing：空白间隔

            2.background背景

                CSS1属性：

                    background-color：背景颜色

                    background-image：背景图片

                    background-repaeat：设置图片是否平铺/重复，多用no-repeat

                    background-attachment：背景图片是否固定或随页面其余部分滚动

                    background-position：改变背景图位置

                CSS3新增属性：

                    background-size：背景图大小

                    background-origin：设置背景图定位区域

                    background-clip：设置背景图绘画区域

                    简写时，顺序为：color，image，repeat

            3.行内元素，块级元素，行内块元素

                            是否能并排排列     是否能设置宽高       不设置width时   举例

                块级元素        ×                   √               自动收缩        div，p，h1~h6,ul/ol li等

                行内元素        √                   ×               自动收缩        span，a，b等

                行内块元素      √                   √               自动撑满        img，表单元素

            4.元素的隐藏

                display：block          将元素转换为块级元素

                display：inline         将元素转换为行内元素

                display：inline-block   将元素转换为行内块元素

                display：none           隐藏该元素，元素不占位，等同无此元素

                visibility：nonehidden  隐藏该元素，元素占位，此元素还存在

        二、盒子模型

            margin：外间距

                    margin-top/bottom/left/right：单独设置某一方向的外间距

                    eg：margin：10px；  上下左右

                        margin：10px 20px； 上下 左右

                        margin：10px 20px 30px； 上 左右 下

                        margin：10px 20px 30px 40px； 上 右 下 左

                    注意：margin有塌陷问题

                            同级之间上下margin，取大值

                            嵌套盒子，子盒子加margin-top不生效，可由父盒子设置padding和border

             padding：内边距

                    padding-top/bottom/left/right：单独设置某一方向的内边距

                    eg：padding：10px；  上下左右

                        padding：10px 20px； 上下 左右

                        padding：10px 20px 30px； 上 左右 下

                        padding：10px 20px 30px 40px； 上 右 下 左  

            border：边框

                    写法：border：宽度 样式 颜色；

                            eg：border：1px solid red；

                    设置边框线颜色：border-top/bottom/left/right

                    样式：  solid    实线

                            dashed  虚线

                            dotted  点

                    transparent：透明色

                    border-radius：设置边框圆角（px设置圆角固定值，%设置相对百分比，取值50%时为圆形）