<!DOCTYPE html><html><head> <title></title></head><style type="text/css"> .a{ width: 1000px; background-color: #333; overflow: auto; } .z{ width: 33.3333%; float: left; height: 100px; border: 1px solid red; } .x{ width: 33.3333%; height: 100px; float: left; border: 1px solid yellow; } .c{ width: 33.3333%; height: 100px; float: left; border: 1px solid #fff; }</style><body><div class="a"> <div class="z"></div> <div class="x"></div> <div class="c"></div></div></body></html>在不影響寬度的情況下 ? ?讓div。c ?浮動上去。 ?我依稀記得有一條屬性可以做到，現(xiàn)在不記得了
6 回答
愁晴
TA貢獻4條經(jīng)驗 獲得超2個贊
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title></title>
? ? <style type="text/css">
? ? ? ? .a{
? ? ? ? ? ? width: 1000px;
? ? ? ? ? ? background-color: #333;
? ? ? ? ? ? overflow: auto;
? ? ? ? ? ??
? ? ? ? ? ? -webkit-columns:3;
? ? ? ? ? ? -moz-columns:3;
? ? ? ? ? ? columns:3;
? ? ? ? ? ? -webkit-column-gap:0;
? ? ? ? ? ? -moz-column-gap:0;
? ? ? ? ? ? column-gap:0;
? ? ? ? }
? ? ? ? .z{
? ? ? ? ? ? height: 100px;
? ? ? ? ? ? border: 1px solid red;
? ? ? ? }
? ? ? ? .x{
? ? ? ? ? ? height: 100px;
? ? ? ? ? ? border: 1px solid yellow;
? ? ? ? }
? ? ? ? .c{
? ? ? ? ? ? height: 100px;
? ? ? ? ? ? border: 1px solid #fff;
? ? ? ? }
? ? </style>
</head>
<body>
<div>
? ? <div></div>
? ? <div></div>
? ? <div></div>
</div>
</body>
</html>
這是代碼！
一步十年
TA貢獻11條經(jīng)驗 獲得超0個贊
邊框也算寬，3條邊框總共占了6px,3個百分比+6px總長超盒子1000px了，在不影響寬度的情況下 ? ?讓div。c ?浮動。把邊框改成background顏色就行了，如果你硬要那樣弄是無法實現(xiàn)，代碼問題。再說寬度搞百分比小數(shù)個人覺得好奇怪，根本就達不到前端精確的要求、要么改成
<style type="text/css">
.a{
width: 1000px;
background-color: blue;
}
.z{
width: 30%;
float: left;
height: 100px;
border: 1px solid red;
}
.x{
width: 394px;
height: 100px;
float: left;
border: 1px solid yellow;
}
.c{
width: 30%;
height: 100px;
float: left;
border: 1px solid green;
}
</style>
body部分不變，你看下吧
添加回答
舉報
0/150
提交
取消