css里,怎样使多个div元素并列一行?

html-css021

css里,怎样使多个div元素并列一行?,第1张

使多个div并列一行的方法是将div的css样式设知定为浮动方式:float:left或者是设定为inline-block行内块元道素【ie6下设置为inline行内元素已保证兼容性】。版

前提是几个div宽度总和不能超出父元素的宽度。

<div

class="d1

clearfix">

<div

class="d1-1"></div>

<div

class="d1-2"></div>

<div

class="d1-3"></div>

</div>

css:

.d1{

width:1200px

margin:0

auto

overflow:hidden}

.d1

div{

float:left/*将块元素div设定权为左浮动*//*display:inline-block

_display:inline*/

width:400px

height:150px

background:#ccc}

例如:

<div class="div1"><a>1</a></div>

<div class="div2"><a>1</a></div>

<div class="div3"><a>1</a></div>

<div class="div4"><a>1</a></div>

<style>

.div1,.div2,.div3,.div4 a:hover{color:red}

.div1,.div2,.div3,.div4 a:link{color:#ddd}

</style>

每一个都要加上点

按照样式定义:\x0d\x0a.div1,.div2,.div3,.div4 a:hover {}\x0d\x0a.div1,.div2,.div3,.div4 a:link {} \x0d\x0a\x0d\x0a如果你的div 的名字是div1~4,那么应该使用\x0d\x0a#div1,#div2,#div3,#div4