读书笔记:微信小程序布局之行内元素和块级元素
元素按照顯示方式主要可以分為塊級元素和行內(nèi)元素,元素的顯示方式由display屬性控制。
塊級元素特點(diǎn)總結(jié):
1、總是在新行上開始
2、寬度的默認(rèn)為width+margin-left+margin-right+padding-left+padding-right剛好等于父級元素的內(nèi)容區(qū)域?qū)挾?#xff0c;即父元素的width。當(dāng)設(shè)定新的寬度,如果寬度是100%,并且padding、margin不為零,導(dǎo)致塊級元素寬度溢出父元素
3、盒子模型的高度默認(rèn)由內(nèi)容決定
4、盒子模型中高度、寬度和內(nèi)外邊距都是可控制
5、可以容納行內(nèi)元素和其他塊級元素。
行內(nèi)元素(diaplay:inline)特點(diǎn)總結(jié):
1、和其他非塊級元素在同一行
2、盒子模型中高度、寬度、上下margin、上下padding設(shè)置無效,只能設(shè)置左右的margin和左右的padding
3、寬度就是文字或圖片的寬度,不可改變
4、行內(nèi)元素的寬度和高度都不能直接設(shè)置
5、行內(nèi)元素只能容納文本或其他行內(nèi)元素,在行內(nèi)元素中放置其他的塊級元素會引起不必要的混亂
行內(nèi)塊元素(display:inline-block)的特點(diǎn):
?行內(nèi)塊元素可以設(shè)置寬、高、內(nèi)外邊距,可以簡單理解為行內(nèi)塊元素就是把塊級元素以行的形式展示,保留了塊級元素對寬、高、內(nèi)外邊距的設(shè)置。
總結(jié)
以上是生活随笔為你收集整理的读书笔记:微信小程序布局之行内元素和块级元素的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 一个屌丝程序员的青春(二七)
- 下一篇: 机器学习评估指标 - f1, preci