網頁設計與雲端應用
- margin：水平左右對齊
http://tncomu10601.ugm.com.tw/css/margin_align.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>margin_左右對齊</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.container{
width: 70%;
height: 1000px;
margin: 0 auto;
background-color: #A62626;
}
</style>
</head>
<body>
<div class="container"></div>
</body>
</html>
- position_左右對齊
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>position_左右對齊</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
/**/
.container{
width: 70%;
height: 1000px;
background-color: red;
position: absolute;
left:0px;
}
</style>
</head>
<body>
<div class="container"></div>
</body>
</html>
- float_左右對齊
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>float_左右對齊</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
/**/
.container{
width: 70%;
height: 1000px;
background-color: red;
float: right;
}
</style>
</head>
<body>
<div class="container"></div>
</body>
</html>
-