CSS課題（CSS03・04）

自宅課題

CSS03とCSS04の解答です。
【CSS03】

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>CSS03の問題</title>
<meta name="description" content="CSS03の問題を考えてみました。まだまだ時間がかかってしまいます。" />
<meta name="keyword" content="構造の四銃士,CSS,問題" />
<style type="text/css">
<!--
body {
  font-family: "メイリオ",sans-serif;
  width: 500px;
}
h2 {
  color: darkblue;
  padding: 10px;
  background-color: #cccccc;
  border: 1px solid;
}
ul {
  list-style-type: none;
  list-style-image: url(img/01.gif);
}
-->
</style>
</head>
<body>
<h2>構造主義の四銃士</h2>

<p>言語学に限られていた「構造主義」の理説ををそれぞれの分野で展開し、後の世代に多大な影響を与えたのは次の４人です。</p>
<ul>
    <li>ミシェル・フーコー</li>
    <li>ロラン・バルト</li>
    <li>クロード・レヴィ＝ストロース</li>
    <li>ジャック・ラカン</li>
</ul>
<p>生まれた順番は、次の通りです。</p>
<ol>
    <li>ジャック・ラカン</li>
    <li>クロード・レヴィ＝ストロース</li>
    <li>ロラン・バルト</li>
    <li>ミシェル・フーコー</li>
</ol>
<h2>それぞれの功績</h2>
<dl>
<dt>ミシェル・フーコー</dt>
<dd>    構造論的な手法による歴史分析を通して、西欧的人間像の系譜を明らかにした</dd>
<dt>ロラン・バルト</dt>
<dd>    言語＝文化が社会の中で「制度」として人々に及ぼす影響を分析した</dd>
<dt>クロード・レヴィ＝ストロース</dt>
<dd>    構造言語学の考え方を人類学の中に導入して構造主義の方法を確立</dd>
<dt>ジャック・ラカン</dt>
<dd>    「フロイトに還れ」を合言葉に、独自の精神分析学理論を展開</dd>
</dl>
</body>
</html>

【CSS04】

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>エコロジー＆環境問題</title>
<style type="text/css">
<!--
* {
  font-size: 100%;
}
#container {
  width: 470px;
  }
h1 {
  font-size: 120%;
  color: #5A9B73;
  line-height: 3.0em;
  height: 57px;
  padding-left: 75px;  
  background: url(images/logo.gif) no-repeat #fff;
}
hr {
  color: #5A9B73;
  height: 50px;
  background: #5A9B73 url(images/ecology.gif) no-repeat center center;
  margin: 0 auto;
}
h2 {
  height: 20px;
  padding-left: 25px;
  background: #ffffff url(images/mark.gif) left center no-repeat;
}
#footer {
  color: #5A9B73;
  border-top: 10px solid #5A9B73;
  text-align: center;
}
address a:link {
  color: #5A9B73;
}
address a:visited {
  color: red;
}
address a:hover {
  color: blue;
}
address a:active {
  color:green;
}
-->
</style>
</head>
<body>
<div id="container">
<h1>Computer Technology Group</h1>
<hr />
<img src="images/img.jpg" alt="画像" />
<div class="section">
<h2><img src="images/ecology_sub01.gif" alt="エコロジーへの取り組み" /></h2>
<p>エコロジーや環境問題への関心は、年々高くなっています。<br />
Computer Technology Groupsでは早くからエコロジーの研究に取り組んできました。自然エネルギーの活用もすすめており、二酸化炭素（CO2）の排出量を減らす努力もしています。<br />
専門家の招致、育成にも努め、来春には環境研究施設を設立する予定です。 </p>
<p>地域の自然環境の育成にも努めています。植樹、植林活動から、公園の整備なども行っています。また、社内裏手には広くて気持ちのいい芝生の丘があり、一般にも開放しています。昼休みなどには、憩いの場として賑わっています。</p>
</div>
<div class="section">
<h2><img src="images/ecology_sub02.gif" alt="商品のラインナップ" /></h2>
<p>紙やプラスチック、コンピューター・パーツのリサイクルにも力を入れ、あらゆる面での活動をひろげています。<br />
リサイクル商品のラインナップも豊富で、オンラインのショッピングコーナーではもちろんのこと、各地域のリサイクルセンターでもお買い求めいただけます。 </p>
</div>
<div id="footer">
<address>Copyright(C) <a href="#">Computer Technology Groups.</a> All rights reserved.</address>
</div>
</div>
</body>
</html>