position：static （静态定位） |& absolute （绝对定位） |& fixed （固定定位） |& relative& （相对定位）
属性参数：
static：静态定位，无特殊定位，对象遵循HTML定位规则（html的默认状态）
absolute：绝对定位，对象脱离文档流，需要使用 left、top、right、bottom等属性进行精确地定位。可以运用z-index属性进行层叠。（使用绝对定位时如果出现元素飘动，没有在你指定的位置上，可以在元素的父级元素上使用相对定位。&个人建议&）
relative：相对定位，对象不脱离文档流，无法像absolute一样进行层叠，但依然要使用 left、top、right、bottom等属性进行正常文档流中相对原来的对象位置进行移动，原位会被其他元素占据。
fixed：固定定位，脱离文档流，可以使元素在屏幕上保持固定位置，即使滚动条下拉元素位置也不会改变。
&div& style="border=&1px& solid red；position：absolute；top：150px；left：200px；"&我是div111111&/div&
&&& div111111会向下移动150px、向右移动200px处
&div& style="border=&1px& solid red；position：absolute；bottom：50px；right：100px；"&我是div222222&/div&
　　div222222会向移动到距离底部150px、距离右边框100px处
当你要做一个始终在页面右下角显示的模块时使用& position：fixed；bottom：50px；right：50px；可以使div在距离底部50px和右边框50px处显示且不管你的页面怎么改变，div一直会显示在你可视范围内的相同位置
z-index：100px；后面跟的像素越大div所在的层级越高
float：left& |& left& |& none；向右、向左或者 不使用（默认）
float：脱离文档流，浮动是相对于父级元素进行的浮动
&div& id="div1"&
　　&div& id="div2"&&/div&
如上：div1为div2的父级元素div2只能在div1里面进行浮动
浮动的一个经常使用的情形，就是水平导航条的运用。水平导航条有两种方式可以实现，只要将 li 标签的display属性改为行内样式，就可以让列表平铺，这是核心部分，但是在了解盒子模型我们可以知道，行内标签的& margin、padding对上下方向是无效的，这里只能让列表选项的左右拉长，上下是不会被控制的，块级标签上下才会被控制。
float也是简单的一些文字环绕图片效果的运用将图片和文字放入同一个div内然后给图片和div一个float：left& |& right；
&div&& style="width:220height:300float:"&
　　&img& src=".."&& style=" float:"/&这里是文字654651进行图文混排以及文字环绕kj dsh gkjh kjh jb kjf bg kjs dh fkj gh kj sd hjf hk jk jsh kjg hk
阅读(...) 评论()css&&浮动后的元素不论是什么display的都默认是block就是设置inline也是block
IE/6出现双边框的原因
出现双边距的条件是当浮动元素的浮动方向和margin的方向一致时才会出现。也就是说，并不是只有块状元素左浮动，且具有左外边距时才有这个BUG，当一个盒子右浮动的同时有一个向右的margin-right的时候，IE6也会把margin-right解析为原来的2倍。当有多个同行元素都浮动了，而且都有同方向的margin，则只有最靠近浮动方向的元素有双边距bug。（如果都是一个方向的浮动那么第一个只有双边距，但同时也有右边的浮动，那么也同样是双边距，原理是相对谁浮动的）
解决这个bug有两个方法：
1.给float的元素添加一个display：inline
2.给ie6写一个hack，其值是正常值的一半，即_margin-right:10这个方法不推荐，因为要加hack写法，而这个是要尽量避免写的。但是这个正好能够说明这个bug的真实存在。
本来以为，将display设置为inline后，就改变了BUG产生的条件之一，即必须是块状元素。但是后来又看到了下面这段话：“熟悉规则的人知道浮动元素自动设置为”block”元素，而不管他们之前是什么。这说明浮动元素上的{display:
}会被忽略，事实上所有的浏览器没有呈现任何改变，包括IE。但是，它不知何故让IE停止将浮动元素的边界翻倍。”
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。HTML中如何让两个div并排显示，举个例子_百度知道
HTML中如何让两个div并排显示，举个例子
答题抽奖
首次认真答题后
即可获得3次抽奖机会，100%中奖。
来自百度知道认证团队
获赞数：436
擅长：暂未定制
主要有三种方法：使用display的inline属性&通过设置float来让Div并排显示&对于两个div并排，左边为绝对宽度，右边为相对宽度的，需要用到这种布局的情况比较多见，如左边为导航，右边为内容的页面将最大的容器padding-left固定宽度，左边的固定宽度的一块position:absolute，然后right的一块width为百分百使用position:absolute
来自知道合伙人认证行家
互联网类行家
采纳数：10561
获赞数：51450
冲浪网站优化网总经理，互联网运营，网站推广专家。
　　可以采用浮动的方法，只要宽度足够，两个div就可以在一排显示。打div里面包含两个小div。　　方法如下：　　1、创建一个大div。　　代码如下：　　#main &{float:border:1px&&&width:100%; &}　　2、创建一个左边小div　　代码如下：　　#left{float:border:1px&&&width:40%; &}　　3、创建一个右边小div　　代码如下：　　#right {float:border:1px&&&width:40%; &}　　4、制作成css文件，或者直接添加到网页上，就可以实现并排显示。
本回答被网友采纳
采纳数：12
获赞数：173
html:代码我简略写了。&div class=&dd&&div1&/div&
&div class=&dd&&div2&div/&css代码：
width:200(一定要制定一个宽度)
folat:left
(这是让所有div标签左浮动)}呵呵，不知道你看懂了没？？？？
不好意思啊，没看懂，能不能详细点，初学
那你有没有学过css样式啊。如果你不知道。那我这样给你说吧。你把下面代码复制新建到一个html中运行。代码如下：&html&&head&&title&div并排显示&/title&&/head&&body&&!--这是两个div--&&div
style=&width:300height:300background:float:left&&div1哈哈哈哈&/div& &div style=&width:300height:300background:float:left&&div2呵呵呵呵&div/&&/body&&/html&不知道这个你看懂了没。。。。。。关键是设置float:left这个属性。
看懂了，非常感谢你
本回答被提问者采纳
来自百度知道认证团队
采纳数：529
获赞数：2554
方法如下：1、创建一个大div。代码如下：#main
{float:border:1px
width:100%;
}2、创建一个左边小div代码如下：#left{float:border:1px
width:40%;
}3、创建一个右边小div代码如下：#right {float:border:1px
width:40%;
}4、制作成css文件，或者直接添加到网页上，就可以实现并排显示。具体如下：1、简介编程是编写程序的中文简称，就是让计算机代为解决某个问题，对某个计算体系规定一定的运算方式，是计算体系按照该计算方式运行，并最终得到相应结果的过程。为了使计算机能够理解人的意图，人类就必须将需解决的问题的思路、方法和手段通过计算机能够理解的形式告诉计算机，使得计算机能够根据人的指令一步一步去工作，完成某种特定的任务。这种人和计算体系之间交流的过程就是编程。2、汇编程序汇编程序。使用汇编语言编写计算机程序，程序员仍然需要十分熟悉计算机系统的硬件结构，所以从程序设计本身上来看仍然是低效率的、繁琐的。但正是由于汇编语言与计算机硬件系统关系密切，在某些特定的场合，如对时空效率要求很高的系统核心程序以及实时控制程序等，迄今为止汇编语言仍然是十分有效的程序设计工具。3、执行原理计算机对除机器语言以外的源程序不能直接识别、理解和执行，都必须通过某种方式转换为计算机能够直接执行的。这种将高级编程硬件程序设计语言编写的源程序转换到机器目标程序的方式有两种:解释方式和编译方式。
来自百度知道认证团队
获赞数：110
擅长：暂未定制
例子如下：（1）先创建一个大div。代码如下：#main {float:border:1px width:100%; }（2）创建一个左边小div代码如下：#left{float:border:1px width:40%; }（3）创建一个右边小div代码如下：#right {float:border:1px width:40%; }（4）制作成css文件，或者直接添加到网页上，就可以实现并排显示这是采用浮动的方法，如果你的div没有并排显示，那么你要注意宽度，因为只要宽度足够，两个div就可以在一排显示。打div里面包含两个小div。你可以先用DIV定义一个层，然后在层里给两个图片有浮动属性，这样就不会发生图片跑到下一行去了，div盒子本身默认样式属性是独占一行，而解决div独占一行方法通常有两种，一种为设置浮动，另外一种为设置display样式。接下来是另一种呢方法。我们加入display:inline即可解决实现同行并排显示div盒子对象。对div标签设置div{ display:inline}样式，为了区别其他不需要设置横向排列显示div盒子对象，我们对相邻需要同排显示的div盒子统一加粗css类，css命名为&.div-inline&。
来自百度知道认证团队
采纳数：16
获赞数：1370
擅长：暂未定制
让两个Div并排显示的方法有很多，使用display的inline属性、通过设置float来让Div并排显示都可以实现。以下为3种方法和例子：一、使用display的inline属性，&代码如下:&div style=&width:300 height: float: display:inline&&AAAA&/div&&&div style=&width:300 height: float: display:inline&&BBBB&/div&&二、通过设置float来让Div并排显示&，代码如下:&style&&#left,#right {float:border:1 padding:10}&&/style&&&div id= &main &&&&div id= &left && 1111 &/div&&&div id= &right && 2222&2222&2222 &/div&&&!-- 如果不用clear属性可能会出现浏览器不兼容问题,clear设这元素周围没有浮动元素 --&&&div style=&clear:both&&&/div&&&/div&&三、对于两个div并排，左边为绝对宽度，右边为相对宽度的，需要用到这种布局的情况比较多见，如左边为导航，右边为内容的页面 。1、将最大的容器padding-left固定宽度，左边的固定宽度的一块position:absolute，然后right的一块width为百分百&2、 使用position:absolute。代码如下：&style&&body{ margin:0; height:100%}&html{ height:100%} /*兼容firefox的div高度100%*/&#left{ position: top:0; left:0; width:200 height:100%; background-color:#CCCCCC}&#right{ margin-left:200 height:100%; background-color:#0099FF}&&/style&&&div id=&left&&left&/div&&&div id=&right&&right&/div&&
其他3条回答
为你推荐：
其他类似问题
您可能关注的内容
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。篇文章13 人订阅相关文章来自专栏342来自专栏319来自专栏60来自专栏169来自专栏273来自专栏328扫描二维码扫描关注云+社区