css float问题，求解

2011-06-21 05:13:08 306 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

oracle两节点RAC，由于gipc导致某节点crs无法启动问题分析两节点RAC，其中1 节点集群CRS无法启动。经过分析原因为2节点gipcd进程异常，导致节点之间无法正常通信，重启2节点gipcd.bin后问题得以恢复。从现象来看，是 ora.crsd... 阅读详情

有三个框，如果设置第一个框为浮动，那么第二框和第三个框重合；第二框浮动，第三个框背景色消失，似乎是和第二个框重合。在精通CSS书中讲，如果第一个框浮动，会遮住第二个框，为什么和书上讲的不一致呢？还有第二框浮动，为什么第三个框只是北京颜色和第二个框重合，文字还是停留在原位呢？

...全文

小蔺的米哈游数据分析师之路——MYSQL篇作为新人，记录自己mysql学习历程阅读详情

shijuren

CSS 61,116 成员 60,701 内容

+ 关注 + 加入社区

切换为时间正序

lijia_415 2011-07-06

打赏
举报

什么乱七八糟的。直接上代码。

missgd152 2011-07-06

打赏
举报

我觉得书上说的不一定正确，还是实践体现一下吧！即使树上说的是对的，但是CSS也再不断的优化，总会有点大同小异。

yo010yo 2011-07-06

打赏
举报

.one{
float:left;
background-color:#567;
height: 120px;
width:450px;
position:absolute; //这句是我加的
}
这样就跟你书上说的一样了

Super_Ninja 2011-06-28

打赏
举报

不好意思，代码贴错了。



<!DOCTYPE html>

<head>

<title>float demo</title>

<style>

.one{

float:left; 

background-color:#567;

height: 120px;

width:450px;

}

.two{

float:left;

background-color:#356;

height:120px;

width:450px;

}

.three{

float:left;

background-color:#978;

height:120px;

width:450px;

}



</style>

</head>

<body>

<div class="parent">

<div class="one">

This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block.  

</div>



<div class="two">

This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block.  

</div>

<div class="three">

This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block.  

</div>

</div>

</body>

</html>

Super_Ninja 2011-06-28

打赏
举报

该怎么回答你呢！首先，p标签是段落标签，div是块标签。你两者混合使用，想实现想要的布局效果，肯定会出问题的！建议你先把<p class="two">.......</p>换成<div>吧。不知道你想实现的布局方式是什么，难道是横向排列？如果是这样，那么适当改一下你的代码就可以了。



<!DOCTYPE html>

<head>

<title>float demo</title>

<style>

.one{ background-color:#567;

height: 120px;

width:450px;

}

.two{

background-color:#356;

height:120px;

width:450px;

}

.three{

background-color:#978;

height:120px;

width:450px;

}



</style>

</head>

<body>

<div class="parent">

<div class="one">

This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block.  

</div>



<p class="two">

This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block.  

</p>

<div class="three">

This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block.  

</div>

</div>

</body>

</html>

你加上margin属性块之间的间隔就明显了。

shijuren 2011-06-26

打赏
举报

我的代码是这么写的：
<!DOCTYPE html>
<head>
<title>float demo</title>
<style>
.one{ background-color:#567;
height: 120px;
width:450px;
}
.two{
background-color:#356;
height:120px;
width:450px;
}
.three{
background-color:#978;
height:120px;
width:450px;
}

</style>
</head>
<body>
<div class="parent">
<div class="one">
This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block. This is the No.1 div block.
</div>

<p class="two">
This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block. This is the No.2 div block.
</p>
<div class="three">
This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block. This is the No.3 div block.
</div>
</div>
</body>
</html>
浏览器是FF

Super_Ninja 2011-06-24

打赏
举报

我敢保证你带吗贴出来了答案就出来了。有时你自己代码的一点错误将会导致很离奇的问题。believe。。。paste the code

missgd152 2011-06-24

打赏
举报

设置float的时候，如果有多个框需要设置，就要设置相对浮动的情况，单单设置一个框的浮动是远远不够的。

aykkk 2011-06-24

打赏
举报

无代码无真相,贴个代码能要了你的命吗

athrunzero 2011-06-24

打赏
举报

把代码发出来就知道问题的所在了

665 2011-06-23

打赏
举报

贴代码吧呵呵

CaiKanXP 2011-06-23

打赏
举报

楼主很强悍，把HTML+CSS代码完全翻译成汉语，可惜我等很少有人能看懂

suchcl 2011-06-23

打赏
举报

贴代码。

挨踢直男 2011-06-23

打赏
举报

浮动怎么会重合，定位才会重合

cena_jin 2011-06-23

打赏
举报

不理解你的明白的啦~

chendong_j 2011-06-21

打赏
举报

无代码无真相

潮起潮落 2011-06-21

打赏
举报

你把demo代码贴一下。
浮动归根结底就是脱离文档流。

xuexiaodong2009 2011-06-21

打赏
举报

[Quote=引用 1 楼 acesidonu 的回复:]

代码写的有问题
[/Quote]代码写的有问题

flyerwing 2011-06-21

打赏
举报

[Quote=引用 2 楼 lxqyyh 的回复:]
把第三个框也设置浮动。
[/Quote]
第三个框clearN下

LXQYYH 2011-06-21

打赏
举报

把第三个框也设置浮动。

加载更多回复（2）

css float问题，求解

相关推荐