空色・・・そらいろ
青空は季節によってかなり濃さが違ってくる |
marginを指定すると、罫線の外側に余白が入ります
marginで指定した余白が重複する場合は値の大きい方が適用されます
そのため「margin:50px」と指定したh2（見出し）とp（文章）間の余白は50pxでなく、100pxです。
以下がソースです。
<html>
<head>
<title>色の景色</title>
<style type="text/css">
<!--
body{color:#333333;background-color:#e7e0e1}
h2{font-size:16px;color:#45466b;
background-color:#dbe9dd;
border-style:solid;
border-width:4px;
border-color:#377c5f;
margin:50px}//h2（見出し）に対する余白
p{border-style:solid;
background-color:#c1c5d7;
border-width:4px;
border-color:#98d1e9;
margin:100px}//p（文章）に対する余白
--></style>
</head>
<body>
<h2>空色・・・そらいろ</h2>
<p>
青空は季節によってかなり濃さが違ってくる<br>
天空と低空でも違って見える<br>
「空色」と言う色見本に近いのは待ちこがれたいた春の明るい空の<br>
地平線近くの色だろうか<br>
「天色」を「てんしょく」と読めば空模様のことだが<br>
「あまいろ」とか「そらいろ」と読むことで明るい青空の色になる</p>
</body>
</html>