<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja" dir="ltr">
<head>
<title></title>
<link rel="stylesheet" href="" media="screen,projection">
<style type="text/css">
div#test_div1{
width: 80%;
background-color: red;
}
p{
color: white;
background-color: blue;
width: 50%;
}
p#test_p1{
text-align: center;
}
p#test_p2{
margin-left: auto;
margin-right: auto;
}
p#test_p3{
text-align: center;
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
<!-- ↓下の「ボックス」は、80%の横幅に、赤い背景色。-->
<div id="test_div1">
<!-- 段落はボックスの半分の横幅に、青い背景色。 -->
<p>通常の段落。</p>
<p id="test_p1">段落の中のテキストをセンタリング</p>
<p id="test_p2">段落そのものをセンタリング</p>
<p id="test_p3">段落そのものと中のテキストをセンタリング</p>
</div>
</body>
</html>