请教高手关于DIV+CSS布局的问题

来源:百度知道 编辑:UC知道 时间:2024/09/22 16:42:08
CSS代码如下:
#body{
margin:0 auto;
text-align:center;
}

#header{
MARGIN: 0 ;
BORDER: 0px;
BACKGROUND: #CC0000;
WIDTH: 800px;
HEIGHT: 150px;
}

#logo{
width:800px;
height:100px;
}

#banner{
width:800px;
height:50px;
background:#00CCCC;
}

#mainbox {
MARGIN: 0 auto;
WIDTH: 800px;
height:1500px;
BACKGROUND: #009933;
}

#menu {
FLOAT: right;
MARGIN: 0;
PADDING:0;
float:left;
WIDTH: 600px;
height:50px;
BACKGROUND: #33CCFF;
float:left;
}

#menu ul {
CLEAR: left;
MARGIN: 0px;
PADDING:0px;
BORDER: 0px;
LIST-STYLE-TYPE: none;
TEXT-ALIGN: center;
DISPLAY:inline;
}

#menu li {
FLOAT: left;
DISPLAY: block;
MARGIN: 0px;
PADDING: 0px;
TEXT-ALIGN: center
}

#

FLOAT 和position 都是用来定位的
float有三歌属性 分别为left right none 如果你设置了float:left的话,那么他的意思就是向其父元素的左侧靠紧。(注意是它的父元素)
position主要是用来设置绝对定位和相对定位的。它的属性有static absolute
relative fixed 主要用到的是absolute(绝对定位) relative(相对定位) 当你设置了position:absolute 时,那么它在对齐是就不是对齐到它的父块了,而是相对body来对齐的了,反之relative则是相对于父块进行对齐的。 这里要好好理解一下,很重要的。
clear
它是用来清除浮动的 比如clear:both 就是说清除两边的浮动的。当你两边都有DIV块时而且吧你想要显示出来的块给遮住了,你可以使用它来显示的。
display 有两个属性 inline block
display: block 表示为垂直排列 让其显示。

其实你可以在百度里搜索一下,答案更加的详细 而且还有相应的例子。
希望对你有帮助

你在#left里面加一个:float:left;就能在同一行显示了啊

在定义#right的时候你用了右浮动,相对于也得用左浮动的

我来告诉你详细的修改方式

首先你的left 和 right需要定义float:left

<div>
<div id="left">这里是文档的左边</div>
<div id="right">这里是文档的右边</div>
</div>
还有你left 和 right的父一级层,必须指定宽度,这两个解决就OK了,IE7下测试无问题。
以下是我修改后的代码:

<html>
<head>
<title>adgaf</title&g