爲什麼div標籤不能用作包裝塊？

我用來製作卡片。但是，似乎沒有提供任何邊界，因此整個頁面都具有背景色。我試圖修補四處，改變地方但它不起作用。爲什麼是這樣？以下是我的代碼。爲什麼div標籤不能用作包裝塊？

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <meta charset="UTF-8"> 
    <link rel="stylesheet" type="text/css" href="../static/main.css"> 
    <title>Title</title> 
</head> 
<body> 

<form method="POST" action="/" enctype="multipart/form-data"> 
    <div>{{ form.csrf_token }}</div> 
    <div>{{ form.tweet_text()}}</div> 
    <div>{{ form.tweet_image()}}</div> 
<div>{{ form.submit()}}</div> 
</form> 

<div> 
    <div class="card"> 
     <img src="http://media.npr.org/assets/news/2009/10/27/facebook1_sq-17f6f5e06d5742d8c53576f7c13d5cf7158202a9.jpg?s=16" alt="" /> 
     <h1>Rohit Falor</h1> 
     <p>From the restored 540 K Streamliner to the all-new S65 AMG Coupe to the Concept Coupe SUV.</p> 
    </div> 
</div> 


</body> 
</html>

這裏是我的CSS：

body{ 
    background-color : azure; 
    } 
.card{ 
    height: 100px; 
    width: 350px; 
    border: 1px solid gray; 
    box-shadow: 1px 1px 3px #888; 
    border-top: 10px solid green; 
    min-height: 250px; 
    padding: 10px; 
    margin: 10px; 
    } 
img{ 
    border-radius: 50%; 
    width: 70px; 
    margin: 10px; 
    }

來源

2017-01-28 Manh Nguyen Huu

對象沒有background-color默認屬性（默認是透明的）。如果你想要給它透明以外的其他東西，你需要定義它。

這樣做將設置下列屬性，爲.card類定義的最簡單方法：

background-color: white;

或

background: white; /* This allows for more attributes */

來源

2017-01-28 03:12:06

它似乎並沒有工作。整個頁面仍然呈天藍色，就好像卡片佈局根本不存在。 –

確保在.card類定義的括號{}中添加此項。當我測試它時，它工作正常。 –

我做到了。由於某些原因，它不適用於我。 –

爲什麼div標籤不能用作包裝塊？

回答

相關問題