如何实现 CSS 两个 DIV 平行存放

html-css013

如何实现 CSS 两个 DIV 平行存放,第1张

设为浮动可以实现:

<style>

div {float:left width:200px height:100px border:1px solid #000}

</style>

<div></div>

<div></div>

或者设为inline-block也可:

<style>

div {display:inline-block width:200px height:100px border:1px solid #000}

</style>

<div></div><div></div>

1.打开DW软件后先建站点,设置站点名称和站点所在文件夹路径(站点和站点内的文件夹名字最好都不要起中文,有可能会造成乱码!)2.在站点文件夹下新建一个css文件夹,然后再在css文件夹下新建一个css文件(记住:设置css文件的后缀名一定为.css,默认的是html的)

外部:在head内加<link rel="stylesheet" href="xxx.css" type="text/css" />

内部:在head内加<style type="text/css">css代码</style>

内联:在标签内加style,如<div style="font-size:14pxcolor:#FF0000">

<div id="demo">

<div class="inner">

<p><a href="#">链接</a></p>

<p><input type="checkbox" name="" id="" /></p>

</div>

</div>

class 选择器 .inner{ width:100px}

id 选择器 #demo{ width:100px}

标签 选择器 p{ width:100px}

后代选择器 p a{ color: #f60}

伪类选择器 a:hover{ color: #f00}

伪元素选择器 a:after{ clear: both}

属性选择器 input[type=checkbox]{ margin-left: 10px}

css3选择器

由于ie的问题,比较常用的是前4种选择器。