                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /如何用CSS进行网页布局

为什么改不了div right的背景颜色

<style type="text/css">
body{ margin:0; padding:0; font-size:30px; font-weight:bold}
div{ text-align:center; line-height:50px}
.main{ width:960px; height:600px; margin:0 auto}
.left{ width:300px; height:600px; background:#ccc; position:absolute; float:left;}}/*左浮动样式*/
.right{ width:660px; height:600px; background:red; position:absolute;float:left;}/*右浮动样式*/
</style>
</head>

<body>
<div class="main">
    <div class="left">left</div>
    <div class="right">right</div>
</div>
为什么改不了div class="right"的背景颜色

O1dSky

2016-12-02

源自：如何用CSS进行网页布局 3-3

关注问题我要回答

2090

操作

收起

6 回答

nishigui 回答被采纳 +3 积分
2016-12-06

我也出现了同样的问题，但是这个代码我在dw上写了，都显示出来了，所以我觉得应该不是代码的问题。遇到这种问题找不到为啥的先换个地方写一下，再说吧。望采纳。

0 回复有任何疑惑可以回复我~

#1

O1dSky 提问者

我自己新建了html文件，把代码复制进去还是这样啊

2016-12-07 回复有任何疑惑可以回复我~

#2

O1dSky 提问者

原来是left后面多了一个}，导致right的背景颜色显示不出。

2016-12-07 回复有任何疑惑可以回复我~

#3

9527000000 回复 O1dSky 提问者

正解！

2018-07-11 回复有任何疑惑可以回复我~

OB丶Bang
2016-12-19

你把颜色的代码，放到最后面就可以了

0 回复有任何疑惑可以回复我~

#1

O1dSky 提问者

放的位置并不会影响结果好伐，是 .left最后多了一个}

2016-12-20 回复有任何疑惑可以回复我~

O1dSky 提问者
2016-12-07

原来是left后面多了一个}，导致right的背景颜色显示不出

9 回复有任何疑惑可以回复我~

六月ovo
2016-12-06

因为你的.left 和 .right都设置了浮动，所以父元素发生高度塌陷。需要为父元素增加一个属性:overflow:hidden;或者为父元素增加高度，这样才能显示出来父元素的背景了。

高度塌陷是什么呢？在学习浮动的时候，应该都记得，浮动会把对象从文档流里面提取出来，所以，浮动之后的对象就不再在原来的流中，那么父元素没有提取出来，子元素提取出来了，那父元素就没有内容把它撑开了，这样就发生了高度塌陷。

1 回复有任何疑惑可以回复我~

#1

不好意思，回复错页面了，这里竟然没有删除回复的按钮。

2016-12-06 回复有任何疑惑可以回复我~

#2

我觉得好像也是这样

2016-12-14 回复有任何疑惑可以回复我~

#3

O1dSky 提问者回复 qq_明天_88

不是的，原来是 .left最后面有两个}}导致的出错

2016-12-20 回复有任何疑惑可以回复我~

qq_明天_88
2016-12-02

不会吧，你可以换种颜色试试，还是不行的话你就<span style="color:red">right<span>直接加在内容上

0 回复有任何疑惑可以回复我~

qq_明天_88
2016-12-02

不会吧，你可以换种颜色试试，还是不行的话你就<span style="color:red">right<span>直接加在内容上

0 回复有任何疑惑可以回复我~

#1

O1dSky 提问者

不是改right字的颜色，是改div的背景颜色啊

2016-12-02 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

如何用CSS进行网页布局

参与学习 209539 人
解答问题 1206 个

用最简洁的案例教你布局的那些知识，这是前端工程师基本技能

为什么改不了div right的背景颜色

我要回答关注问题

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

扫描二维码
关注慕课网微信公众号