關(guān)于height:100%

知識(shí)點(diǎn)概要
1、百分比高度值要想起作用,其父級(jí)必須有一個(gè)可以生效的高度值;
2、絕對(duì)定位的元素高度百分比生效,可以不為其定位父元素顯示指定高度;
2.1絕對(duì)定位元素百分比相對(duì)于其定位生效父元素的padding-box高度計(jì)算;
2.2 如其定位父元素為body,則其高度為窗口padding-box高度 * 高度百分比
2.3 如果其定位父元素未顯示定義高度,則其高度為父元素計(jì)算后的padding-box高度 * 高度百分比

3、絕對(duì)定位元素寬高百分比計(jì)算是相對(duì)于padding-box的寬高,普通元素寬高百分比是相對(duì)于content-box的高度來(lái)計(jì)算的。

一、為普通元素設(shè)置高度百分比

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問(wèn)答題47 /72 常見(jiàn)瀏覽器兼容性問(wèn)題與解決方案? 參考答案 (1)瀏覽器兼容問(wèn)題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,122評(píng)論 1 92
  • 常見(jiàn)的三種情況: 1, 父容器height: auto,無(wú)論height:100%或者h(yuǎn)eight:inherit...
    乘著風(fēng)閱讀 1,068評(píng)論 0 4
  • 1. 前言 前端圈有個(gè)“?!保涸诿嬖嚂r(shí),問(wèn)個(gè)css的position屬性能刷掉一半人,其中不乏工作四五年的同學(xué)。在...
    YjWorld閱讀 4,908評(píng)論 5 15
  • 上周居然忘記了,完全沒(méi)想起來(lái)簡(jiǎn)書(shū)這回事兒。 上周五發(fā)了工資,二季度的績(jī)效還沒(méi)發(fā),瞬間就覺(jué)得捉襟見(jiàn)肘了,好在自己也沒(méi)...
    徐小墩閱讀 199評(píng)論 0 0

友情鏈接更多精彩內(nèi)容