CSS DIV如何做这样的排版
<div id="b2">
<div class="aa">001</div>
<div class="bb">002</div>
<div class="cc">003</div>
</div>
<div id="b3">004</div>
这样的代码可以么，CSS文件要如何写啊？
1ãéä¸DIVb2ï¼ç¹å»å³ä¾§CSSé项å¡ä¸ç+å·ï¼æ·»å CSSæ ·å¼å®ä¹ã
2ãå¨æ°å»ºCSSè§åé¢æ¿ä¸éæ©#b2ï¼å¯¹åºDIV b2çIDï¼ï¼ç¡®å®ã
3ãå¨CSSè§åå®ä¹é¢æ¿å·¦ä¾§åç±»ä¸éæ©æ¹æ¡ï¼å³ä¾§è¾å ¥å¯¹åºçæ°å¼ãb2çDIVå®ä¹å¥½äº
4ãä¸é¢å®ä¹DIV001ï¼åæ ·éä¸DIV001ï¼ç¹+å·æ°å»ºCSSã
5ãå¨CSSè§åå®ä¹ä¸éæ©âèæ¯âï¼éæ©å¥½è²å½©ï¼
6ãéæ©âæ¹æ¡âï¼å®ä¹DIV001ç宽ï¼é«ï¼æµ®å¨float为leftã
7ãåDIV001ä¸æ ·ï¼æ°å»ºDIV002æ ·å¼ã
8ãéæ©èæ¯è²
9ãéæ©æ¹æ¡åï¼å¡«åDIV002çæ ·å¼å±æ§å¼ï¼æ³¨æï¼å 为å®æ¯åå³æµ®å¨çï¼æ以è¿éçFLOATè¦éæ©ä¸ºrightã
10ãåDIV001ä¸æ ·ï¼æ°å»ºå¹¶è®¾å®DIV003çåæ°
11ãå®ä¹DIV004çæ ·å¼ï¼å 为DIV004åä¸é¢çDIV-B2æ¯ä¸æ ·ç宽度ï¼æ以è¿é设置为width:400pxï¼Clear为bothï¼é²æ¢æçæµè§å¨å ¼å®¹æ§é®é¢èä½ç§»ã
12ã设置å®æ¯ï¼æ¥ç左侧çææã
<style type="text/css">
/*
*{margin:0;padding:0;}
#w{width:980px;height:800px;margin:0 auto;border:#999 5px;border-style:dashed solid;}
#l{float:left;width:70%;height:600px;}
#l p{height:50%;}
.t{background:#00f;}
.b{background:#fcc;}
#r{float:right;width:30%;height:600px;clear:right;background:#0f0;}
#b{height:200px;background:#f00;clear:both;}
*/
*{margin:0;padding:0;}
#w{width:980px;height:800px;margin:0 auto;border:#999 5px;border-style:dashed solid;}
#b2{position:relative;width:980px;height:600px;}
.aa{width:700px;height:300px;position:absolute;top:0;left:0;background:#09c;}
.bb{width:280px;height:600px;position:absolute;top:0;right:0;background:#0f0;}
.cc{width:700px;height:300px;position:absolute;top:300px;left:0;background:#00f;}
#b3{height:200px;background:#ff0;clear:both;}
</style>
</head>
<body>
<!--
<div id="w">
<div id="l">
<p class="t">001</p>
<p class="b">003</p>
</div>
<div id="r">002</div>
<div id="b">004</div>
</div>
-->
<div id="w">
<div id="b2">
<div class="aa">001</div>
<div class="bb">002</div>
<div class="cc">003</div>
</div>
<div id="b3">004</div>
</div>
</body>
<div class="b1_1"><!--这个div包函001跟003，然后左对齐：float:left-->
<div class="aa">001</div>
<div class="cc">003</div>
</div>
<div class="bb">002</div><!--这个div右对齐：float:right-->
</div>
<div class="b2">004</div>
<div class="top">
<div class="left">
<div class="left1"></div>
<div class="left2"></div>
</div>
<div class="right"></div>
</div>
<div class="bottom"></div>
</div>
css 就不写了 边框的上下左右可以分别设置
<html>
<head>
<style type="text/css">
p{margin:0px;padding:0px;}
#b2{
width:900px;
height:600px;
}
#b1{
width:700px;
height:600px;
float:left;
}
.aa{
width:700px;
height:300px;
float:left;
background:#0C6;
}
.bb{
width:700px;
height:300px;
float:left;
background:#09F;
}
.cc{
width:200px;
height:600px;
float:right;
background:#F00;
}
#b3{
width:900px;
height:200px;
background:#0F0;
}
</style>
</head>
<body>
<div id="b2">
<div id="b1">
<div class="aa">001</div>
<div class="bb">003</div>
</div>
<div class="cc">002</div>
</div>
<div id="b3">004</div>
</div>
</body>
</html>本回答被提问者和网友采纳
css实现三栏布局?
cssdiv三栏布局三栏都是顶部对齐但是中栏自适应宽度如何实现1、实现方式：左右元素浮动，中间元素左右marign值撑开两边距离。例：此时看似没有问题，可是如果中间内容过多，超出左右两边高度，我们将看到文字环绕问题，如下如所示。2、假定你左右两边的div宽度是一样的，都是300px，那么你可以给中间的div设...
如何用DIV+CSS将网页布局 左中右 并列
首先，设定一个父容器，宽度为900px，使用居中属性确保其居中显示。然后，为每个子元素设置宽度，例如30%，高度统一为100%，并添加1px的黑色边框以突出区块。使用float属性让元素水平排列。接着，为左侧元素添加margin-left属性，使其与容器边缘保持10px的距离。同样，中间和右侧元素亦需添加margin-left属性...
divcss布局设计?
7、在test.html文件内，使用div创建网页的底部，使用clear:both清除上面div的浮动，避免影响底部的布局。同时，使用margin:0auto设置div居中，同时设置其宽度为800px，背景颜色为#000fff。8、在浏览器打开test.html文件，查看实现的效果，这样问题就解决了。怎么进行divcss网页布局1 在桌面建立一个index.ht...
CSS DIV如何做这样的排版
1、选中DIVb2，点击右侧CSS选项卡下的+号，添加CSS样式定义。2、在新建CSS规则面板下选择#b2（对应DIV b2的ID），确定。3、在CSS规则定义面板左侧分类下选择方框，右侧输入对应的数值。b2的DIV定义好了 4、下面定义DIV001，同样选中DIV001，点+号新建CSS。5、在CSS规则定义下选择“背景”，选择好色彩...
div+css如何左对齐?
div+css如下网页中效果图：如下详解：设置一个大的区域nav，里面包含两个部分区域块，nav1与nav2，使他们在nav中靠左浮动；主要标签：float:left;靠左浮动；扩展：float:right;靠右浮动；而与之相关标签：clear:both;则是去除左右浮动；?clear:left;去除左浮动?clear:right;清除右浮动 ...
css如何让div页面居中css怎样让div居中
方法一:使用绝对布局位置:absolutefordiv并设置top、left、right、bottom的值相等，但不一定都等于0；并设置边距:自动。方法二:这个方法需要知道div的宽度和高度。使用绝对布局位置:绝对用于div并将top和left的值设置为50%；50%是指页面窗口宽度和高度的50%；最后，将div向左上方移动div宽度和高度的一半...
div+css如何做页面的一行两列布局
div+css做页面的一行两列布局,首先我们是需要三个div的,第一个div包裹着其他的2个div,然后给那2个div设置float属性和width,height,最好是给个border利于布局的时候方便观察,这里举个例子: <html> <head> <style> #div1{ width:960px; \/\/通过id来控制 height:600px; } .left{ width:400px height:400...
如何实现CSS样式之多个层DIV并排布局?
1、使用cssfloat并排显示：对div设置一个float浮动属性即可解决不并排显示，只要并排div盒子总宽度小于或等于最外层盒子宽度即可实现多个div对象并排显示。加float浮动实现多个div并排显示。这里对div通设一个浮动，当然实际使用时候，要通排显示div对象的加入css类，就对要同行显示css选择器设置浮动。避免其它...
div+css如何左对齐?
1、div左对齐条件与方法只需要对要靠左对齐（局左）的div样式加float:left即可，这里新建一个html文件，创建一个div容器并给它一个class属性，容器里面是两个div，一个靠左对齐，一个靠右，以示区别：2、接下来设置css样式，在style标签中，设置div的float值为left，就实现左对齐了，最后在给div高度，...
css里,怎样使多个div元素并列一行?
想要让多个div元素并列成一行，可以将div元素的float属性设置为left。但这样做还不够，应为当浏 览器的宽度小于这几个div的宽度总和时还是会有div会跑到底部，所以需要将想要并列的div元素套 在另外一个大div里，当然，这个大div宽度要大于并排div宽度的总和。这样子，就可以做到怎么变 换窗口大小时di...
