web开发学习什么，你必须知道的CSS盒模型

块级元素：

1).霸占一行，不能与其他任何元素并列

2).能接受宽、高

3).如果不设置宽度，那么宽度将默认变为父亲的100%，即和父亲一样宽

行内元素：

1).与其他元素并排

2).不能设置宽、高。默认的宽度就是文字的宽度

在HTML中，标签分为：文本级和容器级；

文本级：p、span、a、b、i、u、em

容器级：div、h系列、li、dt、dd

温馨小提示：

(1).容器级的标签，里面可以放置任何东西；文本级的标签里面，只能放置文字、图片、表单元素。

(2).p标签是一个文本级标签。p里面只能放文字、图片、表单元素。其他的一律不能放。

(3).定义列表是一个组标签，不过比较复杂，出现了三个标签：

dl表示definition list 定义列表

dt表示definition title 定义标题

dd表示definition description 定义表述词儿

dt、dd只能在dl里面；dl里面只能有dt、dd

你好

这里是撒哈拉沙漠

别想

你走不出这里的

除非

跪下来喊爸爸，我带你

`

表达的语义是两层：

• 是一个列表，列出了你好、别想、除非三个词

• 每一个词儿都有自己的描述项。

dd是描述dt的。

延伸外之后，开始说正事儿

css的分类和HTML的分类很像，就p不一样

所有的文本级标签都是行内元素，除了p；

p是个文本级，但是是个块级元素；

所有的容器级标签都是块级元素

我们用图表示一下：

4.块级元素与行内元素的相互转换

===============================================================================

块级元素可以设置为行内元素；

行内元素也可以设置为块级元素。

举个例子：

div {

display: inline;

background-color: pink;

width: 400px;

height: 400px;

}

display是显示模式，用来改变元素的行内、块级性质

，一旦给一个标签设置display:inline;那么这个标签立即变为行内元素。此时div和span没有什么区别，此时的div不能设置宽度和高度（即使设置了也并不显示出来，不信你去用代码验证一下呀），此时div可以和别人并排

同理

span {

display: block;

width: 300px;

height: 300px;

background-color: green;

}

此span标签变为块级元素，与div无异；此时的span能够设置高度和宽度；并且霸占一行，别人不能与之并排；如果不设置宽度，那么将撑满父亲。

标准流里面的限制特别多，标签的性质也特备恶心。标准流做不出网页：因为能并排的不能改宽高。所以，要脱离标准流。

css中有三种手段可以使一个元素脱离标准文档流，分别为浮动和绝对定位,固定定位。

最后

我可以将最近整理的前端面试题分享出来，其中包含HTML、CSS、JavaScript、服务端与网络、Vue、浏览器、数据结构与算法等等，还在持续整理更新中，希望大家都能找到心仪的工作。

篇幅有限，仅展示部分截图：