为什么我的html没有显示呢，css文件是外联的

发布于
2017-08-29

更新于
2017-08-29

<!DOCTYPE html>
    <html lang="zh-CN">
        <head>
            <meta charset="UTF-8"  name="viewport" content="width=device-width, initial-scale=1.0">
            <link rel="stylesheet" href="lesson1.css" />
        </head>
        
        <body>
            <div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
                <div class="one" ></div>
            </div>


        </body>
    </html>

    
    
    .one{
            border-radius:25px;
            background-color:yellow;
            width:30%;
            height:30%;
            margin:10%;
            float:left;
        }

阅读 4.7k

9 个回答

发布于
2017-08-29

给最外层div设置宽高就好了，或者.one这个类的div不要给百分比。
父级元素要有宽高，子级元素才能相对于父级给百分比。

escaple_plan

发布于
2017-08-29

子盒子全部浮动了, 给父盒子设个高度

红双喜经典VS中华

发布于
2017-08-29

.one 的父类没有设置宽度啊，

发布于
2017-08-29

没高当然不显示
height:30%;不起作用,这个是要继承父元素的高，父元素没有高所以不起作用
你给父元素div设个高就行了，想设100%给html,body,body>div{100%;}

发布于
2017-08-29

因为你指定的高度等于0，
你指定.one的高度是%单位，这个会向父元素找的，你的父元没有高度，当然不显示了

发布于
2017-08-29

因为你外层的DIV没有宽高。

给最外层DIV设置一个宽高即可。

发布于
2017-08-29

浮动导致父元素高度为0；
此时子元素height: 30%;及height: 0;
所以子元素不会显示出来

天空的阴霾

发布于
2017-08-29

父类没有高度，浮动也没有清除，给父类加高度height：30%;清除浮动clear:both

一枚小笨蛋

发布于
2017-08-29

新手上路，请多包涵

浮动元素会使父元素塌陷，这是浮动的其中一个副作用
这个地方最简单的方式是给父元素设置 overflow: hidden;,这样会使父元素成为 BFC，会重新计算父元素的宽高，包括里面浮动的子元素

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题