元芳怎么了
2019-03-04 12:31:58
html元素的寬度雖然是100%,但是當(dāng)內(nèi)容超過(guò)瀏覽器寬度出現(xiàn)滾動(dòng)條時(shí),把滾動(dòng)條拉向右側(cè),總是發(fā)現(xiàn)元素會(huì)超出html元素的寬度。怎樣讓html始終包圍所有元素?<!doctype html><html><head> <meta charset="UTF-8"> <title>Document</title> <style> html { border: 1px solid black; width: 100%; } </style></head><body> lkjlaksjfklajfkalsdddddddaaaadfajflkajflkajflkajflkjasklfjaslkfjaklsjfklasjfklasjfaklsfsd</body></html>
4 回答

翻過(guò)高山走不出你
TA貢獻(xiàn)1875條經(jīng)驗(yàn) 獲得超3個(gè)贊
css3
html {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
border: 1px solid black;
}

夢(mèng)里花落0921
TA貢獻(xiàn)1772條經(jīng)驗(yàn) 獲得超6個(gè)贊
你這完全是對(duì)html不了解。width: 100%只是針對(duì)瀏覽器寬度的。
你說(shuō)的這個(gè)功能一般稱(chēng)作wrap_content,也就是parent 始終包裹著內(nèi)容。
然后很抱歉的告訴你,html目前應(yīng)該是不支持這個(gè)功能的,我們一般通過(guò)內(nèi)容的展示形式來(lái)修復(fù)此些功能。比如,換行,或者overflow: hidden.
當(dāng)然你非要實(shí)現(xiàn)的話,也有比較hack的方式,通過(guò)js來(lái)計(jì)算寬度,然后設(shè)置給html,不過(guò)不建議使用,這種方式會(huì)引發(fā)reflow。
添加回答
舉報(bào)
0/150
提交
取消