Html寬度100％
[英]Html width 100%
問題描述
這讓我瘋了。 “寬度：100％”會發生什么？ 顯然它只適用於IExplore，所以我認為這是微軟所做的事情之一。
但那么......你怎么告訴一個必須以所有瀏覽器都能理解的方式獲取所有可用父空間的元素呢？
干杯？
5 個解決方案
解決方案1
13 已采納 2010-05-11 23:41:45
塊級元素（display：block;）將自動占據父元素寬度的100％。 您可以使用百分比或像素調整其寬度。 內聯元素（display：inline;）的寬度不能修改。
如果你想要占用所有父元素空間，我建議你嘗試這樣的事情：
.class{
display:block;
width:100%;
}
解決方案2
4 2010-05-11 23:56:36
寬度：100％肯定不是MS制造。 理解諸如box模型和內聯vs塊（例如spans vs divs）元素之類的東西將幫助你理解你將看到的一些內容。 瀏覽器的差異與“寬度：100％”的關系不如瀏覽器如何解釋給定元素的盒子模型，特別是邊距，邊框和填充等.AFAIK，所有瀏覽器都會尊重寬度：100％，但他們如何解釋其他一切可能會影響他們放棄的空間為“100％”。
請記住，100％是父母的100％，而不是WINDOW。
<body>
<div id = "one" style="width:50%">
<div id = "two" style = "width:100%" />
</div>
</body>
在這種情況下，“兩個”仍然只是窗口寬度的50％，因為它在50％寬的父級中。 （1 * .5 = .5）
所以說，一個莫名其妙的行為的具體例子將極大地幫助人們給你一個具體的答案。
解決方案3
2 2010-05-11 23:42:53
如果我理解正確，你會問width: 100%是否僅限IE。 答案是不; 它被所有主流瀏覽器所理解。 資料來源： http ： //www.w3schools.com/css/pr_dim_width.asp
解決方案4
1 2010-05-11 23:47:31
請注意，寬度：100％將不適用於內聯標記...所以類似或屬性“顯示”為值“內聯”的內容不受影響。
如果那個消息給你，我建議抓一本書，因為HTML不是學習adhoc的東西。
解決方案5
-2 2014-03-27 04:31:26
html {
width:100%;
}
body {
background-color:#f2f2f2;
margin:0;
padding:0;
}
a {
color:#ec3f3f;
text-decoration:none;
font-weight:400;
font-style:normal;
}
a:hover {
color:#262626;
text-decoration:none;
font-weight:400;
font-style:normal;
}
p,div {
margin:0!important;
}
table {
border-collapse:collapse;
}
::-moz-selection,::selection {
background:#ec3f3f;
color:#fff;
}
.ReadMsgBody,.ExternalClass {
width:100%;
background-color:#f2f2f2;
}
@media only screen and max-width640px{
img[class=img_scale] {
width:100%!important;
height:auto!important;
}
img[class=divider] {
width:440px!important;
height:2px!important;
}
table[class=spacer] {
display:none!important;
}
td[class=center] {
text-align:center!important;
}
table[class=full] {
width:400px!important;
margin-left:20px!important;
margin-right:20px!important;
}
table table,td[class=full_width] {
width:100%!important;
}
div[class=div_scale],table[class=table_scale],td[class=td_scale] {
width:440px!important;
margin:0 auto!important;
}
}
@media only screen and max-width479px{
img[class=img_scale] {
width:100%!important;
height:auto!important;
}
img[class=divider] {
width:280px!important;
height:2px!important;
}
table[class=spacer] {
display:none!important;
}
td[class=center] {
text-align:center!important;
}
table[class=full] {
width:240px!important;
margin-left:20px!important;
margin-right:20px!important;
}
table table,td[class=full_width] {
width:100%!important;
}
div[class=div_scale],table[class=table_scale],td[class=td_scale] {
width:280px!important;
margin:0 auto!important;
}
}
HTML 寬度 100% 溢出
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.