CSS中block级和inline级对象的区别是什么

发布时间:2021-07-09 16:25:06 作者:Leah
来源:亿速云 阅读:209

这篇文章将为大家详细讲解有关CSS中block级和inline级对象的区别是什么,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

CSS中block级和inline级对象的区别

这个看似简单的问题事如果能透彻地理解,会受益匪浅。

◆下图讲解了block级对象和inline级对象的区别:

CSS中block级和inline级对象的区别是什么

◆下面是block级对象和inline级对象的基本区别:

Block级对象会自然地水平充满其父容器,因此没有必要为之设置100%宽度属性

Block级对象的起始摆放位置是其父容器的左上边界,并顺排在其前面的兄弟Block对象的下方(除非设置float或绝对位置)

Inline级对象会忽略其宽度和高度设置

Inline级对象会随着文字排版,并受排版属性的影响(如white-space,font-size,letter-spacing)

Inline级对象可以使用vertical-align属性控制其垂直对齐,block级对象不可以

Inline级对象的下方会保留一些自然的空间,以适应字母g一类的会向下探出的笔画

一个设置为float的inline对象将变成block对象

关于CSS中block级和inline级对象的区别是什么就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。

推荐阅读:
  1. 电信级和网络级光纤跳线的区别是什么?
  2. CSS中如何使用display: inline-block

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

block inline css

上一篇:Angular如何实现搜索、过滤、批量删除、添加、表单验证功能

下一篇:如何使用MUI框架模拟手机端的下拉刷新和上拉加载功能

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》