-
1、內(nèi)容區(qū)域（content area），是一種圍繞文字看不見的盒子。內(nèi)容區(qū)域（content area）的大小與font-size大小相關(guān) 2、內(nèi)聯(lián)盒子（inline boxes），內(nèi)聯(lián)盒子不會讓內(nèi)容成塊顯示，而是排成一行。如果外部含inline水平的標(biāo)簽（span，a，em等），則屬于內(nèi)聯(lián)盒子。如果是個(gè)光禿禿的文字，則屬于匿名內(nèi)聯(lián)盒子。 3、行內(nèi)盒子（line boxes），每一行就是一個(gè)行框盒子，每個(gè)行框盒子又是由一個(gè)一個(gè)內(nèi)聯(lián)盒子（inline boxes）組成。 4、<p>標(biāo)簽所在的包含盒子（containing box），此盒子由一行一行的行框盒子（line boxes）組成。查看全部
-
line-height:行高 基線：規(guī)范字母、文字高度底線的一條線。 垂直居中查看全部
-
多行文本的水平垂直居中： text-align：center和vertical-aligh：middle這個(gè)和圖片的是一樣的，剩下的就是把整段文字加標(biāo)簽變?yōu)閳D片格式（圖片默認(rèn)inline-block元素），接下來把文字繼承的不需要的屬性去掉：line-height：noraml（不然繼承了250px，三行那太高了）；text-align：left；max-width:100%。 適用于IE8+查看全部
-
圖片近似垂直居中，（圖片默認(rèn)是inline-block）“vertical-align:middle”實(shí)際是基線往上1/2X高度； 適合IE8+查看全部
-
小圖片和大文字基本受行高控制（蚍蜉撼不動(dòng)大樹）查看全部
-
消除圖片底部間隙的三種方法： 1.圖片塊狀化display:block.vertical-align作用于inline或者inline-block水平元素，block化后沒法基線對齊； 2.vertical-align：bottom.使得底線對齊，因?yàn)槟J(rèn)基線對齊，修改后則無空; 3.line-height：0.行高足夠小，基線上移查看全部
-
行高不會影響圖片實(shí)際占據(jù)的高度查看全部
-
20px/font-size=1.42857≈1.4286這樣的話body大環(huán)境默認(rèn)行高20px 縮寫也ok查看全部
-
①子元素另外計(jì)算1.5*60=90,兩行內(nèi)聯(lián)框的像素是180px ②父級環(huán)境字體24px,24px*150%=36px 子元素直接繼承父級的36px，行高只有36px,行間距不夠?yàn)樨?fù)值所以重疊 所以，推薦使用數(shù)值，不太使用%/em查看全部
-
line-height支持的屬性值 ① normal 與瀏覽器相關(guān)，在同一瀏覽器中也和元素字體相關(guān)（font-family），所以考慮到兼容性，會設(shè)置默認(rèn)值 ② <number> 根據(jù)當(dāng)前的font-size計(jì)算 ③ <length> em,px,rem,pt ④ <percent> 根據(jù)font-size計(jì)算 ⑤ inherit--行高繼承（input默認(rèn)的行高是normal） 1.5/1.5em(150%)的區(qū)別： --1.5是根據(jù)自己的font-size計(jì)算line-height --1.5em是根據(jù)父級元素font-size計(jì)算，相當(dāng)于繼承了父元素的line-height -------------- 經(jīng)驗(yàn)： --閱讀 1.5 --網(wǎng)頁開發(fā) 匹配20像素（20/font-size）計(jì)算結(jié)果取大不取小查看全部
-
多行文本高度=單行文本高度累加查看全部
-
內(nèi)容區(qū)域高度只與字號以及字體有關(guān)，與line-height無關(guān)查看全部
-
content area+vertical spacing=line-height查看全部
-
內(nèi)聯(lián)元素的高度是由行高決定的即line-height查看全部
-
4包含3,3包含2查看全部
舉報(bào)
0/150
提交
取消