CSS样式

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

提示：这里可以添加本文要记录的大概内容：
今天主要学习了CSS样式

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、CSS样式

justify(两端对齐)
center(局中)
left(左对齐)
right(右对齐)
line-height(行高)用于实现垂直居中
text-indent(首行缩进)缩进2个字符时，值等于字体大小*2
list-style:none(清楚默认样式)
text-decoration:none(用于清楚标签的默认下划线)
text-decoration:overline(定义文本上的线)
overline：定义文本上的一条线
line-through：定义穿过文本下的一条线。
blink：定义闪烁的文本
inherit：规定应该从父元素继承 text-decoration 属性的值。
text-transform：文本转换
word-spacing/letter-spacing：文本间隔
white-space：指定元素内的空白怎样处理
css1属性：
3 text-decoration: underline red; /*红色下划线*/
4 text-decoration: underline wavy red; /*红色波浪形下划线*/
5
6 /*全局值*/
7 text-decoration: inherit;
8 text-decoration: initial;
9 text-decoration: unset;
文本转换属性是用来指定在一个文本中的大写和小写字母。
可用于所有字句变成大写或小写字母，或每个单词的首字母大写。
none：默认。定义带有小写字母和大写字母的标准的文本。
capitalize：文本中的每个单词以大写字母开头。
uppercase：定义仅有大写字母。
lowercase：定义无大写字母，仅有小写字母。
inherit：规定应该从父元素继承 text-transform 属性的值。
normal：默认。定义单词间的标准空间。
length：定义单词间的固定空间。
inherit：规定应该从父元素继承 word-spacing 属性的值。
区别：word-spacing针对中文字、英文单词生效；letter-spacing针对中文字和英文字母生效。
normal：默认。空白会被浏览器忽略。
pre：空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap：文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。
pre-wrap：保留空白符序列，但是正常地进行换行。
pre-line：合并空白符序列，但是保留换行符。
inherit：规定应该从父元素继承 white-space 属性的值。
background-color 背景颜色
background-image 背景图片
background-repeat 背景图片水平或垂直平铺或重复
background-attachment 背景图像是否固定或者随着页面的其余部分滚动
background-position 改变图像在背景中的位置

二、盒子模型属性

Margin（外边距） - 清除边框区域。Margin 没有背景颜色，它是完全透明
Border（边框） - 边框周围的填充和内容。边框是受到盒子的背景颜色影响
Padding（内边距） - 清除内容周围的区域。会受到框中填充的背景颜色影响
Content（内容） - 盒子的内容，显示文本和图像 width：盒子宽度 height：盒子高度
width属性
width属性表示盒子内容的宽度
width属性的单位通常是px，移动端开发也会涉及到百分数、rem等单位
当块级元素（div 、h系列、li等）没有设置width属性时，它将自动撑满，但这并不意味着width可以继承
height属性
height属性表示盒子内容的高度
height属性的单位通常是px，移动端开发也会涉及到百分数、rem等单位
盒子的height属性如果不设置的话，它将自动被内容撑开，如果没有内容，默认是0
padding属性是盒子的内边距，即盒子边框内壁到文字的距离
padding属性可以使用固定数值或百分比进行赋值，但不能使用负值
padding属性如果用四个数值以空格隔开进行设置，分别表示上、右、下、左的padding
padding属性如果用数值以空格隔开进行设置，分别表示 上、左右、下的padding
padding属性如果要用二个数值以空格隔开进行设置，分别表示上下、左右的padding