一.CSS常用属性设置
1背景
(1) background-color
(2)background-image
2.文本
(1)color
(2)text-align
(3) text-decoration
3.对齐方式
要水平居中对齐一个元素(如 <div>), 可以使用 margin: auto;。
设置到元素的宽度将防止它溢出到容器的边缘。
.center {
margin: auto;
width: 50%;
border: 3px solid green;
padding: 10px;
}
如果仅仅是为了文本在元素内居中对齐,可以使用 text-align: center;
.right {
position: absolute;
right: 0px;
width: 300px;
border: 3px solid #73AD21;
padding: 10px;
}
5.6 浮动
/*浮动*/
#d1{
width: 100px;
height: 100px;
background-color: burlywood;
float: left;
}
#d2{
width: 100px;
height: 100px;
background-color: yellowgreen;
/*浮动,左浮动*/
float: left;
}
二.盒子模型
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
#d1 {
width: 100px;
height: 100px;
background-color: #DA70D6;
/* 设置边框 */
border: #008000 5px outset;
/* 设置内边距 */
padding: 10px 20px;
/* 设置外边距 */
margin-top: 100px;
margin-left: 100px;
}
</style>
</head>
<body>
<div id="d1"></div>
</body>
</html>