搜尋

首頁  >  問答  >  主體

內聯樣式問題

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title> ;單列版面配置</title>
 <style>
body{
       margin:0;
身體:0;
}
     .header{padding: 0;
}
   %;
height: 50px;
background-color: green;
}
     .main{
       width: 90%;
/*height: 500px;*/
# background-color: brown;

/* margin-right: auto;往右邊推,居左
       margin-left: auto; 往左邊推,居右*/
margin:5px auto; /*這是簡寫,上下內邊距5px,左右auto居中,重點是塊部分水平居中的處理*/
}
     .main .left{
       width: 30%;










1 : 500px;
background-color: pink;
float: left;/*想左浮動到最上層,脫離文檔流,下排上移*/
}
     .main .right{
       width: 69%;
height: 500px;
background-color: deeppink;
float: right;/*right和left效果是一樣,浮動後形成一個新的文檔流*/
}
     .footer{
        width: 90%;
height: 60px;
background-color: blueviolet;
margin:0 auto;
background-color: blueviolet;
margin:0 auto;
##. clear{
     clear: both;
}

#  </style>

</head>

<body>

 <div class="header"

<body>

 <div class="header" ></div>###  <div class="main">### <div class="left"></div>###    <div class="right"> ;</div>###    <div class="clear"></div>###  </div>###  <div class="footer"></div> ###</body>###</html>#########為什麼在style設定.left樣式時候用.main .left######而設定.clear樣式式直接用.clear###
益伦益伦2495 天前1466

全部回覆(2)我來回復

  • phpcn_u19856

    phpcn_u198562018-01-15 11:14:19

    用.main .left的優先權更高一些,它明確的告訴你這個樣式是main這個類別下的left,把範圍限定了,可以讓瀏覽器更精準的找到它要渲染的物件。

    回覆
    0
  • 韦小宝

    韦小宝2018-01-15 08:53:13

    這是命名,沒有一定的要求。隨便起啥名都可以啊

    回覆
    0
  • 取消回覆