Điều này khiến tôi phát điên. Điều gì xảy ra với "chiều rộng: 100%"? Rõ ràng nó chỉ hoạt động trong IExplore, vì vậy tôi nghĩ đó là một trong những thứ mà Microsoft đã tạo ra.Chiều rộng Html 100%
Nhưng sau đó ... làm thế nào để bạn nói với một yếu tố mà phải mất tất cả không gian của cha mẹ có sẵn theo cách mà tất cả các trình duyệt có thể hiểu được?
Chúc mừng?
Phần tử mức khối (hiển thị: khối;) sẽ tự động chiếm 100% chiều rộng của phần tử gốc. Bạn có thể thay đổi kích thước chiều rộng của nó bằng cách sử dụng phần trăm hoặc pixel. Các phần tử nội dòng (display: inline;) không thể sửa đổi chiều rộng của chúng.
Nếu bạn muốn một cái gì đó để mất tất cả các yếu tố cha mẹ không gian Tôi đề nghị bạn thử một cái gì đó như thế này:
.class{
display:block;
width:100%;
}
Bên cạnh tỷ lệ phần trăm hoặc pixel, bạn có thể sử dụng bất kỳ đơn vị CSS nào –
Tôi đã thử hiển thị: chặn và 100% và không hoạt động. khi bạn thay đổi để hiển thị: nội dòng, nó hoạt động! –
Nếu tôi hiểu bạn một cách chính xác, bạn đang hỏi liệu width: 100% là IE-only. Câu trả lời là không; nó được hiểu bởi tất cả các trình duyệt chính. Nguồn: http://www.w3schools.com/css/pr_dim_width.asp
Lưu ý rằng chiều rộng: 100% sẽ không hoạt động trên thẻ nội tuyến ... Vì vậy, những thứ như hoặc nơi 'hiển thị' thuộc tính dưới dạng giá trị 'nội tuyến' không được thực hiện.
Nếu đó là tin tức cho bạn, tôi khuyên bạn nên lấy một cuốn sách vì HTML không phải là thứ để học về adhoc.
Chiều rộng: 100% chắc chắn không phải là chế tạo MS. Hiểu những thứ như mô hình hộp và khối nội tuyến (ví dụ: nhịp so với div) sẽ giúp bạn hiểu một số điều bạn sẽ thấy. Sự khác biệt của trình duyệt có ít hơn để làm với "Chiều rộng: 100%" so với cách trình duyệt giải thích mô hình hộp cho một phần tử cụ thể và trong những thứ cụ thể như lề, đường viền và padding.AFAIK, tất cả trình duyệt sẽ tôn trọng chiều rộng: 100%, nhưng cách họ giải thích mọi thứ khác có thể tác động đến bao nhiêu không gian mà họ đưa ra là "100%".
Hãy nhớ rằng 100% là 100% của PHỤ HUYNH, không phải là WINDOW.
<body>
<div id = "one" style="width:50%">
<div id = "two" style = "width:100%" />
</div>
</body>
Trong trường hợp này, "hai" sẽ vẫn chỉ chiếm 50% cửa sổ vì nó nằm trong bố mẹ rộng 50%. (1 * .5 = .5)
Vì vậy, nói rằng, một ví dụ cụ thể về hành vi khó hiểu sẽ giúp mọi người cung cấp cho bạn câu trả lời cụ thể.
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;
}
}
Bạn có thể định dạng bài đăng này một chút ... :) – summea
cảm ơn tất cả mọi người! – vtortola