コンピュータ演習（再） 第13回 課題
課題1 CSSを使ったWebページの作成
第12回の課題をともに、エディタでWebページを作成しなさい。
CSSを使って、デザインを調整しなさい。
「マイドキュメント」の「public_html」フォルダにある、
「index.html」「profile.html」「town.html」「memory.html」の各ファイルについて、
次のような編集をしなさい。
HTMLに必要な情報の追加
今回の内容で説明したように、必要な情報を追加します。
- 次の行を各ファイルの最初にコピーして追加してください。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <title>要素の前に、次の行をコピーして追加してください。
<meta http-equiv="content-type" content="text/html; charset=shift_jis">
- <address>要素の中の、更新日の日付を、今日の日付に変更してください。
CSSによるスタイルの設定
- <title>要素の後に、次の行をコピーして追加してください。
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
<!--
body {color: black; background: white;}
h1 {
color: #000000;
background: #FFFFFF;
text-align: center;
border: #FF0000 medium solid;
padding: 0.2em;
}
h2 {
color: #000000;
border-left: #FF0000 medium solid;
border-top: #FF0000 1px solid;
border-bottom: #FF0000 1px solid;
border-right: #FF0000 1px solid;
padding: 0.2em;
}
h3 {
color:#000000;
border-bottom: #00FF00 1px dotted;
padding: 0.2em;
}
p {
margin-left: 1em;
margin-right: 1em;
}
ul {
}
li {
}
dl {
background: yellow;
margin: 0.5em;
padding: 0.5em
}
dt {
color: #0000FF;
padding:0.1em;
}
dd {
padding:0.1em;
}
-->
</style>
- 次の例を参考に、各ファイルにスタイルを設定してください。サンプルは、ブラウザからソースを見てください。
#ref(): The style ref(filename,pagename) is ambiguous and become obsolete. Please try ref(pagename/filename)
- 設定するときには、少しずつ設定し、出来上がりをブラウザで確認するようにしてください。
town.html 497件
[詳細]
