使用css中心背景颜色

问题描述:

我打算给HTML页面的中心添加颜色。我曾经尝试这样做:使用css中心背景颜色

我的HTML文件

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="styles.css"> 
</head> 
<body> 

<div id="v"> 
</div> 
</body> 
</html> 

我styles.css的

#v { 
background: red; 
position: center; 
} 
+0

你对“页面中心”有什么意义?首先尝试使用'background-color'而不是'background'。 – rendon 2014-09-20 16:56:28

+2

将宽度添加到您的div并做边距:0 auto; – justrohu 2014-09-20 16:58:42

您可以设置高度和宽度的div,并添加一个保证金是这样的:

#v { 
height: 100px; 
width: 100px; 
background-color: red; 
margin: auto; 
} 

我会假设你的意思是居中在页面上的元素,然后添加背景颜色到那个元素。尽管您接近,但您的CSS无效。如果你想添加背景,那么你需要使用背景颜色。如果要将该元素居中,则可以在此处调整该元素的边距。是一个可能有所帮助的例子。

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>center a div and add background color</title> 

<style type="text/css"> 

.wrapper{ 
    width: 100%; 
    height: 400px; 
    background-color: blue; 
    margin: 0 auoto; 
} 
.centered-element{ 
    width: 50%; 
    height: 200px; 
    margin: 0 auto; 
    background-color: red; 
} 

p{ 
    text-align: center; 
    } 
</style> 

</head> 

<body> 

<div class="wrapper"> 
    <div class="centered-element"> 
     <p>this div is centered!</p> 
    </div> 
</div> 

</body> 
</html> 

我所做的是给了div,我想中心对齐0自动边缘;这将中心对齐div。我希望这有助于!