大学生网页设计教程素材网

热门搜索: 1 网页设计 2023 2021 2022 1*1

最新交易

原创可商用
海量更新
不限下载
完美售后

学生HTML网页作业中使用DIV标签和SPAN标签的区别是什么

我们在制作网页时会使用到div标签和span标签,很多学生在完成HTML网页作业时,不知道div标签和span标签之间有什么区别,今天爱建网网页设计给大家介绍div标签和span标签之间的区别,希望对你们有所帮助。
1-2110161HS5A0.jpg

简单来说,div标签是块级元素,每个div标签都会从新行开始显示,占据一行,div标签内可以添加其他的标签元素;而span标签是行内元素,会在一行显示,span标签内只能添加行内元素的标签或文本。

DIV标签
div标签是块级元素,拥有块级元素的特点。每对div标签(<div></div>)里的内容都可以占据一行,不会其他标签在一行显示;div标签总是从新行开始显示;
且div标签可以通过css样式来设置自身的宽度(也可省略,当没有使用css自定义宽度时,div标签的宽度为其的容器的100%)、高度,且还可以设置标签之间的距离(外边距和内边距);
我们还可以在div标签中,使用其他标签(行内元素、块级元素都行),比如:span标签,p标签,也可以是div标签。

SPAN标签
span标签是行内元素,拥有行内元素的特点。span标签元素会和其他标签元素会在一行显示(块级元素除外),不会另起一行显示。
span标签的宽度、高度都无法通过css样式设置,它的宽高受其本身内容(文字、图片)控制,随着内容的宽高改变而改变;span标签无法控制外边距和内边距,虽然可以设置左右的外边距和内边距,但上下的外边距和内边距无法设置。
且,span标签里只能容纳文本或者是其他的行内元素,不能容纳块级元素。


上一篇:

下一篇:

Hi, 欢迎加入爱建素材网技术交流群,带你装逼带你飞!

我要入群

爱建素材网,累计帮助1000+学生成功解答网页技术学习,为学习网站开发提供助力!

立刻开启你的建站之旅

在线
客服

在线客服

在线客服 - 爱建素材网周一至周日 10:00-24:00(欢迎呼叫)

选择下列服务马上在线沟通:

客服热线

客服
热线

服务热线

18789616245
6*12小时客服服务热线

QQ二维码

QQ
二维

QQ二维码
顶部