課題2　フォント

課題2-1

  1. Terapadを起動する。
  2. タブの幅を4文字分にし、タブと空白文字を表示する設定に変更する (方法を忘れた場合は前回の資料を参照)。
    3. (前回・今回とも自宅で作業している場合は設定が残っているはずなのでこの工程は飛ばしてよい)
  3. デスクトップに「課題2」フォルダーを作り、さらにその中に「1」フォルダーを作る。
  4. Terapadで「文字/改行コード指定保存」で、文字コードを「UTF-8N」にして、「1」フォルダーの中に「index.html」という名前で保存する。

  5. 以下のコードを記入して上書き保存する。
    6. (ほとんどの部分は前回の課題と共通。適宜前回のものからコピーするとよい)


  6. index.htmlをChromeで開く。
    7. <font>と</font>で囲むと、その間の文字の表示を変えられる。
    fontタグでsizeを指定すると文字の大きさが変わる。
    sizeで指定できるのは1～7の値。3がデフォルトの大きさ。

  7. 赤枠の部分を追加して上書きし、Chromeのページを更新する。
    8. (追加する場所に注意。行番号を参照)


    このような表示になっていれば課題2-1は完了。
fontタグでfaceを指定するとフォントを変えられる。
「ＭＳ ゴシック」「ＭＳ 明朝」の「ＭＳ」は全角、その後ろのスペースは半角にする。
fontタグでcolorを指定すると文字の色を変えられる。
色は英語の色名かRGBの値で指定できる。自前で色を決めたいときはここやここが参考になる。
i タグで囲んだ部分は斜字体になる。ただし、全角文字に対しては無効。
u タグで囲んだ部分にはアンダーラインがつく。
strike タグで囲んだ部分には横棒 (打消し線) がつく。
sup タグで囲んだ部分は上付き文字、sub タグで囲んだ部分は下付き文字になる。
これを使えば簡易的に数式を表示できる。分数や積分記号などを含む本格的な数式は、MathJaxを使えば表示させられる。
b タグで囲んだ部分は太字になる。

課題2-2

  1. 課題2-1の結果表示用のChromeのタブ、TeraPadを閉じる。
  2. 「課題2」フォルダの中に「2」フォルダを作る。
  3. 「2」フォルダの中にindex.htmlを作る (新しく作ってもよいし、課題2-1で作ったものをコピーしてもよい)。
  4. そのindex.htmlを編集し、オリジナルのページを作る。
    5. (例)
課題の条件
注意 (この課題限定ではなく、Webページ全般について)

提出

inserted by FC2 system