Lecture/CompPracR2003/13thExercise の変更点

追加された行はこの色です。
削除された行はこの色です。
Lecture/CompPracR2003/13thExercise へ行く。

RIGHT:[[授業のページへ戻る>Lecture/CompPracR2003]]

*コンピュータ演習（再） 第13回 課題 [#t52f2d2a]

**課題1 CSSを使ったWebページの作成 [#z66c621b]
[[第12回>../12thExercise]]の課題をともに、エディタでWebページを作成しなさい。
CSSを使って、デザインを調整しなさい。

「マイドキュメント」の「public_html」フォルダにある、
「index.html」「profile.html」「town.html」「memory.html」の各ファイルについて、
次のような編集をしなさい。

***HTMLに必要な情報の追加 [#d0782604]
[[今回の内容>../13th]]で説明したように、必要な情報を追加します。
+次の行を各ファイルの最初にコピーして追加してください。
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
+<title>要素の前に、次の行をコピーして追加してください。
   <meta http-equiv="content-type" content="text/html; charset=shift_jis">
+<address>要素の中の、更新日の日付を、今日の日付に変更してください。

***CSSによるスタイルの設定 [#s46c83a0]
+<title>要素の後に、次の行をコピーして追加してください。
  <meta http-equiv="Content-Style-Type" content="text/css">
  <style type="text/css">
  <!--
    body {color: #000000; background: #FFFFFF;}
    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: #0000FF;
      background: yellow;
      margin: 0.5em;
      padding: 0.5em
    }
    dt {
      color: #000000;
      color: #0000FF;
      padding:0.1em;
    }
    dd {
      padding:0.1em;
    }
  -->
  </style>
+次の例を参考に、各ファイルにスタイルを設定してください。サンプルは、ブラウザからソースを見てください。
#ref(town.html,サンプル（town.html）)
+設定するときには、少しずつ設定し、出来上がりをブラウザで確認するようにしてください。

KAWANO's PukiWiki Plus! - Lecture/CompPracR2003/13thExercise の変更点

メニュー

大学関係リンク

今日の5件

最新の5件