利用浮動元素布局,代碼中我的右中怎么顯示不出來
<!DOCTYPE HTML>
<html>
? ? <head>
? ? ? ? <meta http-equiv="content-type" content="text/html;charset=utf-8">
? ? ? ? <title>利用浮動元素嘗試頁面布局</title>
? ? ? ? <style type="text/css">
? ? ? ? ? ? /*清楚固有樣式*/
? ? ? ? ? ? * {
? ? ? ? ? ? ? ? padding:0;
? ? ? ? ? ? ? ? margin:0;
? ? ? ? ? ? }
? ? ? ? ? ? /*設置頭部div*/
? ? ? ? ? ? .header{
? ? ? ? ? ? ? ? margin-top:200px;
? ? ? ? ? ? ? ? width:1000px;
? ? ? ? ? ? ? ? height:100px;
? ? ? ? ? ? ? ? background-color:yellow;
? ? ? ? ? ? ? ? /*設置居中*/
? ? ? ? ? ? ? ? margin:0 auto;
? ? ? ? ? ? }
? ? ? ? ? ? /*設置content div*/
? ? ? ? ? ? .content{
? ? ? ? ? ? ? ? width:1000px;
? ? ? ? ? ? ? ? height:400px;
? ? ? ? ? ? ? ? background-color:orange;
? ? ? ? ? ? ? ? /*設置居中*/
? ? ? ? ? ? ? ? margin:10px auto;
? ? ? ? ? ? }
? ? ? ? ? ? /*設置左中div*/
? ? ? ? ? ? .left{
? ? ? ? ? ? ? ? width:200px;
? ? ? ? ? ? ? ? height:400px;
? ? ? ? ? ? ? ? background-color:skyblue;
? ? ? ? ? ? ? ? /*設置左浮動*/
? ? ? ? ? ? ? ? float:left;
? ? ? ? ? ? }
? ? ? ? ? ? /*/*設置center div/*/
? ? ? ? ? ? .center{
? ? ? ? ? ? ? ? width:580px;
? ? ? ? ? ? ? ? height:400px;
? ? ? ? ? ? ? ? background-color:green;
? ? ? ? ? ? ? ? /*設置中間邊距*/
? ? ? ? ? ? ? ? margin-left:10px;
? ? ? ? ? ? ? ? margin-right:10px;
? ? ? ? ? ? ? ? float:left;
? ? ? ? ? ? }
? ? ? ? ? ? /*設置右中div*/
? ? ? ? ? ? .right{
? ? ? ? ? ? ? ? width:200px;
? ? ? ? ? ? ? ? height:400px;
? ? ? ? ? ? ? ? background-color:skyblue;
? ? ? ? ? ? ? ? float:left;
? ? ? ? ? ? }
? ? ? ? ? ? /*設置footer div*/
? ? ? ? ? ? .footer{
? ? ? ? ? ? ? ? width:1000px;
? ? ? ? ? ? ? ? height:100px;
? ? ? ? ? ? ? ? background-color:black;
? ? ? ? ? ? ? ? margin:0 auto;
? ? ? ? ? ? }
? ? ? ? </style>
? ? </head>
? ? <body>
? ? ? ? <div class="header"></div>
? ? ? ? ? ??
? ? ? ? <div class="content">
? ? ? ? ? ? <div class="left"></div>
? ? ? ? ? ? <div class="center"></div>
? ? ? ? ? ? <div calss="right"></div>
? ? ? ? </div>
? ? ? ? <div class="footer"></div>
? ? </body>
</html>
2017-05-18
因為你在寫代碼是class="right"時,class寫成了calss,所以沒引用到樣式
2017-05-18
代碼寫錯了?? <div calss="right"></div> 這樣能出來才有鬼了 ?class 看看錯哪了
2017-05-18
沒有使用text-align?