CSS 在div中又嵌套了一个div2 div3 如何让div2 div3在div1中并列

html-css014

CSS 在div中又嵌套了一个div2 div3 如何让div2 div3在div1中并列,第1张

第一种方法（需要css3）：

<style>

.div1 {width:400px height:300px border:1px solid #00f}

.div2 {display:inline-block width:150px height:200px border:1px solid #f00}

.div3 {display:inline-block width:150px height:200px border:1px solid #0a0}

</style>

<div class=div1>

<div class=div2></div><div class=div3></div>

</div>

第二种方法：

<style>

.div1 {width:400px height:300px border:1px solid #00f}

.div2 {float:left width:150px height:200px border:1px solid #f00}

.div3 {float:left width:150px height:200px border:1px solid #0a0}

</style>

<div class=div1>

<div class=div2></div><div class=div3></div>

</div>

第三种方法：

<style>

.div1 {position:relative width:400px height:300px border:1px solid #00f}

.div2 {position:absolute left:0 top:0 width:150px height:200px border:1px solid #f00}

.div3 {position:absolute left:152px top:0 width:150px height:200px border:1px solid #0a0}

</style>

<div class=div1>

<div class=div2></div><div class=div3></div>

</div>

不用定位也可以实现

<div id="div1">

    <div id="div2"></div>

</div>

CSS中定义div1的宽度，将div2的设置为居中，上边距为10即可

#div1{width:400pxheight:390pxpadding-top:10px}

#div2{width:380pxheight:380pxmargin:0 auto}

这样实现或者直接#div{padding:10px}也可以， 如果是用定位,固定两个div的宽度后定位即可

#div1{width:400pxheight:400pxposition:relative}

#div2{width:380pxheight:380pxposition:absoluteleft:10pxtop:10px}

#web_background有背景色 因为这个DIV太大了 背景图片完全被DIV盖住了

因为使用绝对位置 所以都被盖住了

rightside如果你换个色就找到了 只是字被盖住了

还有一些低级错误 比如<>符号使用错误 分号冒号使用错误等 我都改了 你调试一下是你要的东西么

<style>

body {font-family:Arialmargin:autofont-size:12pxbackground-image:url(/images/headbg.png) no-repeat}

#web_background {margin:autowidth:1200pxbackground-color:#ccffcc}

#web_logo {background-color:#008080width:1200pxfloat:left}

#navi {width:1200pxheight:40pxbackground:url(navi.gif) }

#left_side {width:200pxheight:800pxbackground-color:#d8bfd8position:relativetop:140pxfloat:left}

#web_main {width:40pxheight:80pxfloat:leftcolor:#fffbackground-color:#000000}

#right_side {width:200pxheight:800pxbackground-color:#d8bfd8position:relativetop:140pxfloat:right}

</style>

<div id="web_background" >

<div id="web_logo">

<a herf="site"title="zhuye"><img src="/zhuye/images/logo.png"title="zhuye"/></a>

</div>

<div id="navi">导航

</div>

<div id="left_side">竖直导航

</div>

<div id="web_main">主要

</div>

<div id="right_side">右导航

</div>

<div style="clear:both"></div>

</div>

回楼上 有的时候系统就是有的UTF-8 或者MYSQL数据库是UTF-8 那页面必须用UTF-8 UTF-8是国际标准 以后会逐渐替代GB2312的 这并不代表不爱国 这种UTF标准确实是领先于GB2312标准 有以下几点优势

使用GBK出国就浏览不了了 或者用英文版的XP就看不了了

使用UTF-8节省网站空间

UTF通用性强 避免乱码问题

一个标准比另一个标准有更好的实用性 那就靠自然法则来决定了