今天做css布局的时候,发现div下的div下的div不受类选择器的控制,代码如下,请各位大佬解惑!

html代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="1.2.css"/>
</head>
<body>
<div id="hezi">

<!--左边-->
<div class="left">

<div class="left-top"> 开心兔 </div>

</div>



</div>
</body>

</html>

css代码

#hezi{
    width:1177px;
    height:750px;
    border:1px solid blue;
    margin:auto;
    position:left;

}
/*左边的div*/
.left{
    width:200px;
    height:650px;
    border:1px solid red;
    position:left;
]
/*左边头部*/
.left-top{
    width:200px;
    height:50px;
    border:1px solid blue;
    position:left;
}

2018-06-15_193025.png

顺序错了,.left-top应该在前,不然被left占了位置。

Last modification:April 6th, 2020 at 07:31 pm