欢迎来到258分享网,纯净的网络源码分享基地!

258资源分享网

全部作品
全部作品
网站源码
微信源码
素材特效
源码插件
视频教程
建站学院
热门搜索: 织梦  农业种植  农业  安全设置  官方
258资源分享 > 建站学院 > 微信开发 > 微信小程序布局之行内元素和块级元素

推荐下载

HTML5响应式自适应网咯设计

2020-05-12   浏览:740

高端HTML5响应式企业通用网

2020-05-06   浏览:521

html5响应式外贸网站英文版

2020-05-08   浏览:510

HTML5自适应律师工作室类网

2020-04-04   浏览:504

HTML5影视传媒文化公司类网

2020-05-12   浏览:502

微信小程序布局之行内元素和块级元素

发布时间:2020-12-21  

元素按照显示方式主要可以分为块级元素和行内元素,元素的显示方式由display属性控制。

块级元素特点总结:

1、总是在新行上开始

2、宽度的默认为width+margin-left+margin-right+padding-left+padding-right刚好等于父级元素的内容区域宽度,即父元素的width。当设定新的宽度,如果宽度是100%,并且padding、margin不为零,导致块级元素宽度溢出父元素

3、盒子模型的高度默认由内容决定

4、盒子模型中高度、宽度和内外边距都是可控制

5、可以容纳行内元素和其他块级元素。

行内元素(diaplay:inline)特点总结:

1、和其他非块级元素在同一行

2、盒子模型中高度、宽度、上下margin、上下padding设置无效,只能设置左右的margin和左右的padding

3、宽度就是文字或图片的宽度,不可改变

4、行内元素的宽度和高度都不能直接设置

5、行内元素只能容纳文本或其他行内元素,在行内元素中放置其他的块级元素会引起不必要的混乱

行内块元素(display:inline-block)的特点:

行内块元素可以设置宽、高、内外边距,可以简单理解为行内块元素就是把块级元素以行的形式展示,保留了块级元素对宽、高、内外边距的设置。