CSS属性

一、字体

字体族：font-family:"宋体"
字体风格：font-style:normal  //正常
font-style:italic  //斜体
font-style:oblique //斜体

字体粗细：
font-weight:lighter //细
font-weight:normal //正常、
font-weight:bold //粗
font-weight:bolder //更粗
font-weight:100~1000 //可以用数值控制，最小100

字体复合写法：
font：font-style font-weight font-size/line-height font-family;
写法规则：字体大小，字体族必须写上，字体族必须最后一位，字体大小倒数第二位，属性中间用空格隔开

二、文本

文本间距：
letter-spacing:    //字母间距
word-spacing:    //单词间距，通过空格识别单词

文本修饰：
属性名：text-decoration
可选值：none  无修饰线
                underline   下划线
                overline   上划线
                line-through  删除线
        可搭配使用值：
        dotted  虚线
        wavy   波浪线

例：
a{
text-decoration:underline dotted red;    //红色下划虚线
}
文本缩进：text-indent

文本对齐：
text-align: 
常用值： left center right 

三、盒子

让盒子里面的元素居中：
    display: flex;
    justify-content: center;
    align-items: center;

图片适应盒子大小：
使用object-fit属性（适用于<img>标签）：
  width: 100%; /* 图片宽度填满父元素 */
  height: 100%; /* 图片高度填满父元素 */
  object-fit: cover; /* 图片将被缩放以填充整个容器 */

要让图片居中，可以使用以下属性：
 对于块级元素（例如<div>）：
        margin-left: auto;
        margin-right: auto;
        这将使元素在水平方向上居中。
对于行内元素（例如<span>）：
        text-align: center;
        这将元素及其内容在父元素中水平居。
对于图片本身img：
        display: block;
        margin-left: auto;
        margin-right: auto;
        这将使图片在其包含的块元素中水平居。

边框相关属性
border-width 边框宽度 
border-color 边框颜色
border-style 边框风格   属性值：none默认值 solid 实线  dashed 虚线  dotted   点线   double 双实线
border  边框复合属性   没有数量顺序要求

四、行内、列表

行高
line-hight
可选值：由浏览器根据文字大小决定一个默认值
        像素（px）
        参考font-size自身倍数
        参考font-size自身百分比
例：
div{
line-height:60px;
line-height:1.5;
line-height:150%;
}

vertical-align        作用：用于指定同一行元素之间，或表格单元格内文字的垂直对齐方式
属性名：vertical-align
常用值：
1、baseline   使元素的基线与父元素的基线对齐
2、top   使元素的顶部与其所在行的顶部对齐
3、middle  使元素的中部与父元素的基线加上父元素字母x的一半对齐
4、bottom   使元素的底部与其所在行的底部对齐

列表相关样式
属性名           功能             属性值（常用值如下）
list-style-type    设置列表符号   none ：不显示前面标识
                                                square： 实心方块        
                                                 disc  ：圆形
                                                decimal：数字
                                           lower-roman: 小写罗马字
                                           upper-roman: 大写罗马字
                                           lower-alpha :小写字母
                                            upper-alpha:大写字母
list-style-position   设置列表符号位置    inside ：在li里面  outside ：在li外面
list-style-image   自定义列表符号    url（图片地址）
list-style     复合属性           没有数量顺序要求

五、表格独有属性（<table>标签）
table-layout  设置列宽   auto:自动，列宽 根据内容计算  fixed：固定宽度
border-spacing 单元格间距   css中的长度值，生效前提是单元格边框不能合并
border-collapse   合并单元格边框    collapse：合并  separate：不合并
empty-cells   隐藏没有内容的单元格   show：显示，默认   hide：隐藏
caption-side   设置单元格标题位置    top：上面（默认） bottom：下面

六、背景属性
background-color  设置背景颜色   默认背景颜色是transparent
background-image  设置背景图片    url（图片地址）
background-repeat   设置背景重复方式  repeat：重复，铺满整个元素，默认值  repeat-x：只在水平方向重复   repeat-y：只在垂直方向重复   no-repeat：不重复
background-position   设置背景图片位置  写两个值，用空格隔开  水平：left，center，right 垂直：top，center，bottom   也可以通过长度指定坐标位置，设置x，y坐标 （10px，20px）
background  复合属性  没有数量和顺序要求

七、鼠标属性
cursor  设置光标样式  

pointer：小手 move：移动图标  text：文字选择器 crosshairs：十字架  wait：等待  help：帮助
cursor:url(""),pointer ;  自定义鼠标类型

八、修改元素显示模式
通过css中的display属性修改元素的默认显示模式
值
none  元素会被隐藏
block 元素作为块级元素显示
inline 元素作为内联元素显示
inline-block 元素作为行内块元素显示