没有做基本的格式化,
创新互联专业IDC数据服务器托管提供商，专业提供成都服务器托管，服务器租用，珉田数据中心，珉田数据中心，成都多线服务器托管等服务器托管服务。
需要为加上
.list{margin:0;padding:0;}
或者在css最前面加上，格式化样式。可以搜下css reset
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;}
一共有三种 形式存在
第一种为标签样式，taglib为标签名，后面{}里面加属性,这种样式对页面内所有的标签名为taglibname的标签起作用。
第二种为css类样式，需要在HTML开始标签 后缀 class="name"，name即类名，这类标签对HTML内所有后缀同样name的标签起作用 class="name" 可以设在多个开始标签后，表示这些标签具有同一类样式。
第三种为cssID样式，需要在HTML开始标签后缀 id="id",需要注意的是，ID样式的话，每一个name都是独立且不重复的，具有唯一性。
希望我的回答对你有帮助
CSS（Cascading Style Sheet，可译为“层叠样式表”或“级联样式表”）是一组格式设置规则，用于控制Web页面的外观。通过使用CSS样式设置页面的格式，可将页面的内容与表现形式分离。页面内容存放在HTML文档中，而用于定义表现形式的CSS规则则存放在另一个文件中或HTML文档的某一部分，通常为文件头部分。将内容与表现形式分离，不仅可使维护站点的外观更加容易，而且还可以使HTML文档代码更加简练，缩短浏览器的加载时间。定义内部样式块对象 你可以在你的HTML文档的HTML和BODY标记之间插入一个STYLE.../STYLE块对象。 定义方式请参阅样式表语法。示例如下： html head title文档标题/title style type="text/css" !-- body {font: 10pt "Arial"} h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon} h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue} p {font: 10pt/12pt "Arial"; color: black} -- /style /head body 请注意，这里将style对象的type属性设置为"text/css"，是允许不支持这类型的浏览器忽略样式表单。 内联定义 (Inline Styles) 内联定义即是在对象的标记内使用对象的style属性定义适用其的样式表属性。示例如下： p style="color: sienna; margin-left: 20px"This is a paragraph/p 导入样式（Import Styles） 与链入外部样式的功能基本相同，只是语法和实现方式上有差别 head title文档标题/title style @import url(css.css); @import url("csss.css") ;//单引号也可以 @import css,css; @import "css.css";//单引号也可以 /style /head 以上几种形式都可以。
CSS样式详解
字体样式(font)
字体
font-family:字体名
font-family:字体名1，字体名2...
font-family: fantasy | monospace | ncursive | serif | sans-serif
字体系列
cursive：模拟手写的字体，通常这类字体的曲线比较明显。
monospace：无比例的字体。通常用于模拟打字机中打出来的文字，也就是等宽字体。
serif：有比例有衬线的字体，这种字体中的所有字母都根据不同需要占有不同的宽度，有衬线是指在字母上做装饰的细线。
sans-serif：有比例无衬线的字体，这种字体中的所有字母都根据不同需要占有不同的宽度。
文字大小
font-size: xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller | 长度 | 百分比
xx-small：文字显示为最小(绝对)；
x-small：文字显示为较小(绝对)；
small：文字显示为小(绝对)；
medium：默认值(绝对)
large：文字显示为大(绝对)；
x-large：文字显示为较大(绝对)；
xx-large：文字显示为最大(绝对)；
larger：增大(相对)；
smaller：减小(相对)；
长度：数值加上单位；
百分比：相对字体大小。
文字大小调整
在英文方面，一段文字看上去是否舒服，很大程度上取决于当前字体的高度与这种字体的小写x字母高度的比值，这个比值称为字体的面值。
font-size-adjust: none | number
none：不改变文字大小；
number：强制文字使用面值。
粗体
font-weight: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
normal：默认值(400)，正常粗细；
bold：加粗(700)；
bolder：比normal粗，比bold细；
lighter：不比normal粗；
x00：分9个级别，数值越大越粗。
斜体
font-style: normal | italic | bolique
normal：默认值，代表正常的字体；
italic：斜体；
bolique：倾斜的字体。
文字变形－小型大写字母
fontvariant: normal | small-caps
normal：默认值；
small-caps：小型大写字母
小型大写字母指将字母更改为大写字母，并且该大写字母比通常的大写字母要小。
文字变形－文字拉伸
font-stretch: normal | narrower | wider | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded
normal：默认值，不拉伸变形；
narrower：水平方向变窄；
wider：水平方向变宽；
condensed：压缩文字；
extra-condensed：压缩得很小；
ultra-condensed：压缩得特别小；
semi-condensed：从大到小逐步缩小；
semi-expanded：从小到大逐步变大；
expanded：拉伸文字；
extra-expanded：拉伸得很大；
ultra-expanded：拉伸得特别大。
PS：font-stretch是CSS2中所规定的属性，目前还没有浏览器可以支持该属性。
修饰
text-decoration: none | underline | overline | line-through | blink
none：默认值，无修饰样式；
underline：下划线；
overline：上划线；
line-through：贯穿线；
blink：闪烁。
阴影
text-shadow: none | color | length | length | length | inherit
none：不设置；
color：阴影的颜色；
length：长度值；
inherit：继承父级样式。
阴影有3个length要进行设置，分别是水平方向的距离、垂直方向的距离和模糊半径的长度(不能为负值)。
大小写转换
text-transform: capitalize | uppercase | lowercase | none | inherit
capitalize：首字母大写；
uppercase：变大写；
lowercase：变小写；
none：不改变；
inherit：继承。
间距－行间距
行间距：文本行与行之间的距离
line-height: normal | number | length | 百分数 | inherit
normal：默认值；
number：在当前文字大小的基础上再做增加来设置行高(不能为负值)；
length：指定行高数(不能为负值)；
百分数：用百分数表示行高；
inherit：继承。
行高是指上一行文字的基线与下一行文字之间的基线之间的距离，行高等于行间距加上文字高度。
间距－字间距
letter-spacing: normal | length | inherit
normal：默认值；
length：字间距的大小；
inherit：继承。
词间距
word-spacing: normal | length | inherit
normal：默认值；
length：词间距的大小；
inherit：继承。
文本样式
文字缩进
text-indent: length | 百分数 | inherit
length：缩进量；
百分数：父级元素的百分比；
inherit：继承。
水平对齐
text-align: left | right | center | justify | string | inherit
left：左对齐；
right：右对齐；
center：居中对齐；
justify：两端对齐；
string：字符对齐，多用于表格里；
inherit：继承。
垂直对齐
vertical-align: baseline | sub | super | top | text-top | middle | bottom | text-bottom | 百分数 | length | inherit
baseline：默认值，基线对齐；
sub：下标；
super：上标；
top：顶端对齐；
text-top：文本行顶端对齐；
middle：中间对齐；
bottom：底端对齐；
text-bottom：文本行底端对齐；
百分数：相对于父级元素的基线的百分比；
length：调整长度；
inherit：继承。
文字方向－文本流入方向
derection: ltr | rtl | inherit
ltr：left to right，默认值，从左到右流入；
rtl：right to left，从右到左流入；
inherit：继承。
文字方向－文字方向
unicode-bidi: normal | embed | bidi-override | inherit
normal：默认值，不打开流入的文字，对其文字不重排；
embed：打开流入的文字，在对象内部进行隐式重排；
bidi-override：严格按流入方向重排文字；
inherit：继承。
文字方向－竖排文字
layout-flow: horizontal | vertical-ideographic
horizontal：书写方向从左到右，由上而下；
vertical-ideographic：书写方向从上至下，由左至右。
空格处理
white-space: normal | pre | nowrap | inherit
normal：默认值，浏览器自动忽略多余的空格，连续多个空格只显示一个；
pre：类似于pre元素，浏览器不忽略源代码的空格；
nowrap：不自动换行；
inherit：继承。
词间换行
word-break: normal | break-all | keep-all
normal：默认值，对于英文则以单词为单位换行，对于中文则以字为单位换行；
break-all：英文以字母为单位换行；
keep-all：对于英文以单词为单位换行，对于中文则以标点或空格为单位换行。
首字样式
使用伪元素fitst-letter，对于英文则代表第一个字母，对于中文则代表第一个文字。
首行样式
使用伪元素first-line，设置第一行文字的样式。
颜色与背景样式
文本颜色：指文本的颜色。
color: 颜色 | inherit
颜色：使用指定颜色值；
inherit：继承。
背景色：指元素后面背景的颜色。
background: transparent | 颜色 | inherit
transparent：设置透明，默认值；
颜色：使用指定颜色值；
inherit：继承。
背景图片
background-image: none | url(路径) | inherit
none：无背景图片(默认值)；
url(路径)：图片的URL地址；
inherit：继承；
背景附件：指背景图片如何依附元素。
background-attachment: scroll | fixed | inherit
scroll：滚动，随内容滚动，默认值；
fixed：固定，不随内容滚动；
inherit：继承。
背景重复
background-repeat: repeat | no-repeat | repeat-x | repeat-y | inherit
repeat：重复，平铺图片，默认值；
no-repeat：不重复，不平铺图片；
repeat-x：水平方向重复；
repeat-y：垂直方向重复；
inherit：继承。
背景定位：背景图片的定位，要设置两个值，分别是相对于元素左上角的x轴和y轴，默认是0px。
background-position: top | center | bottom | left | right | 数值 | 百分数 | inherit
top：顶部；
center：中部；
bottom：底部；
left：左侧；
right：右侧；
数值：用数值指定图片的位置；
百分数：用百分数表示位置；
inherit：继承；
背景综合应用(可节省代码)
background: background-color | background-image | background-repeat | background-attachmen | background-position
background-color：颜色；
background-image：图片；
background-repeat：重复方式；
background-attachmen：附件；
background-position：定位。
学习导航
1、css中的长度与颜色
2、css中的文字属性
3、css中的文本属性
1、文字样式属性
font-family 字体属性
作用：元素内文字以什么字体来显示
语法：font-family:[字体1],[字体2],[......];
说明：含空格字体名和中文，用英文引号（"）括起；多个字体用英文逗号隔开；引号嵌套，外使用双引号，内使用单引号。
font-size 文字大小
作用：元素内文字大小
语法：font-size:绝对单单位，相相对单位
color 文字颜色
语法：颜色名|十六进制|RGB
font-weight 文字粗细
语法：font-weight:normal 正常 | bold 加粗 | bolder 加粗 | lighter 细体 | 100-900
说明：默认值：normal 400等同于normal,而700等同于bold
font-style 文字样式
作用：为元素内文字设置样式
语法：font-style:normal 正常显示 | italic 文字倾斜 | oblique 文字倾斜（基本不用）
font-variant 字体变形
作用：设置元素中文本为小型大写字母
语法：font-variant:normal 正常显示| small-caps 将英文大小写字母调成为同宽
font 属性简写
语法：font:font-style font-variant font-weight font-size/line-height font-family;
说明：值之间空格隔开，注意书写顺序。
2、CSS文本样式
text-align
作用：设置元素内文本的水平对齐方式
语法：tex-align:left 左对齐 | right 右对齐 | center 居中对齐 | justify 两端对齐
注意：该属性对块级元素设置有效
line-height
作用：设置元素中文本行高
语法：line-height:长度值 | 百分比
说明：一行文字的高度，行高指文本行的基线间的距离
文字基线
注意：基线并不是汉字文字的下沿，看图理解自行理解
行高和行距
行高：基线到基线的距离
行距：底线到顶线的距离
注意：看图自行理解
行框和行内框
注意：看图自行理解
vertical-align
作用：设置元素内容的垂直方式
语法：vertical-align:baseline | sub | super | top | text-top | middle | bottom | text-bottom | 长度 | 百分比
注意：看图自行理解
text-indent 首行缩进
3、文本样式属性
text-transform: capitzlize 首字母大写 | uppercase 字母大写 | lowercase 字母小写 | none 正常
text-decoration: underline 下划线 | overline 上划线 | line-through 删除线 | none 正常
综合实操案例
如果您觉得有用，记得在下方点赞、关注、留言，我会定期奉 上更多的惊喜哦，您的打赏支持才是我继续努力的动力，么么哒。
每日分享在学习过程中总结的学习经验，学习笔记，笔试题，HTML，CSS，JavaScript，jQuery教程，Vue教程，PHP教程，TinkPHP教程等，望大家能以学习为目的，每天阅读一篇文章，了解身边的技术。陪有梦想的人一起成长！
重庆分公司
重庆分公司
