因为浏览器在解析第二个p的时候,因为字母之间没有空格,他会以为是是一个单词所以不会换行。

列表

1.无序列表ul 第一内部必须含有子标签<li></li> 第二ul天生自带内外边距 还有一个...p...标签

并集选择器 body,ul,p{}

通配符选择器

好处:简单,省事

坏处:太省事,加大了浏览器的负荷

解决办法:按需选择 list-style...这是属性样式,

除去列表的符号

属性值square正方形disc实心圆none空circle空心圆

ol有序列表 内部必须有子标签 天正自带内外边距

ol和ul不同之处:1前面的符号不同 改变前面符号通过标签属性type

自定义列表 <dl><dt><dd></dd></dt></dl> dd自定义列表dt是小标题dd是内容

列表能做啥

做2级菜单,做导航栏

备注 margin和padding问题的探讨 margin设置一个值说明上右下左都是

margin设置两个值上下/左右 margin设置3个值上/左右/下

margin设置4个值上/右/下/左

padding同上 实际占用的空间大小

通过分析我们发现一个元素实际占用的空间是 width+border+paddin2+margin2

一个标签元素的实际高度是多少 实际高度=height+padding-top+padding-bottom

相邻的两个块级元素同时设置margin时,他们之间的外边距不会叠加回会取最大的这种现象叫margin塌陷

有的标签背景会独占一行

有时会随着内容的增加而改变自己的空间大小

根据以上现象,标签又分 5.

块级:p,h1-h6,ul,li,ol,dl,

内敛:span,img,i,b,a,em,icon,字体标签小图标{矢量}

快级元素会独占一行 快级元素可以设置宽高

内敛不会独占一行 内敛不会设置宽高

内敛元素的marign上下不起作用了

二者转换 块级转行级

给快级元素添加属性display:inline;

行级转块级 display:block;

给有需要的元素设置inline-block;

可以设置宽高可以在一行,margin可以随便使用 line-height行高和height一样是居中 扩展 line-height10px/2 /50% 当是2的时候,2*font-size字体的大小