クレールのコツブロ -3ページ目

WEB制作を学びたい初心者・主婦の為の講座　～ｈｔｍｌその2～

こんばんわ

クレールです。

宮古島は今日も雨ですね～。
少し肌寒い感じです。

さて、昨日はｈｔｍｌタグで簡単なページを作成しましたね？

これまででわからない事はありましたでしょうか？

いくつか問題を出しますね

自分自身で答えてみてください。

①ｈｔｍｌタグは、メモ帳だけでも作成はできる？

②「 < 」と「 > 」の事を名称はなんでしょう？

③「 <div></div> 」の名称は？

④リストを作成するhtmlタグは何でしょう？

⑤「 <a href=""></a> 」の事を、エータグの他に何と呼ぶ？

⑥HTMLの正式名称は？

以上が問題です。
何問解けましたでしょうか？

分からない方は、前回までの内容を再度読んで理解して頂ければ幸いです。

では、答え合わせをします。

①htmlタグはメモ帳だけでも作成は可能です。専用ソフトがあるとより便利で作成しやすいですが最初はメモ帳で作成して慣れましょう。

②「 < 」と「 > 」の名称は・・・・ギュメでしたね

③「 <div></div> 」の名称は・・・・ディブタグでしと呼びましたね。

④リストを作成するhtmlタグは、「 <ul></ul> 」と「 <li></li> 」でしたね。

⑤「 <a href=""></a> 」の事を、エータグの他にはリンクタグでしたね。

⑥HTMLの正式名称は「 Hyper Text Merkup Language 」でしたねぇ。

何問正解でしたか？
復習する方は、

WEB制作を学びたい初心者・主婦の為の講座　～始まり～

WEB制作を学びたい初心者・主婦の為の講座　～HTML その1～

を見て復習して下さい。(b^-゜)

さてさて、今日は以前に作成したｈｔｍｌファイルに色や文字等の装飾する「 css 」に触れてみたいと思います。

その前に少し概要を・・・・

え～「 CSS 」とは、「 Cascading Style Sheet 」(カスケーディング・スタイルシート)の省略名称です。
この「 CSS 」を使って、ｈｔｍｌタグに色を設定したり細かい指定をすることができます。

今回は以前作成したｈｔｍｌファイルに直接「 CSS 」を打ち込みます。

では、さっそくhtmlファイルが格納されている「 sample 」フォルダを開いて下さい。
次に「 index.html 」ファイルを開きます。
※開くときは「 index.html 」ファイルを選択した状態で「右クリック」→「プログラムから選択」→「Notepad」を選択して開きます。

開きましたら、「 index.html 」ファイルに次のように「 CSS 」を打ち込みます。

打ち込みましたでしょうか？
では説明します。

1行目：「 <div> 」「 div 」の後に半角スペースを入力して「style=」を入力します。
そして、「 font-size:20px; 」で入力したら、それを「 ""」(ダブルクォーテーション)で囲みます。
これは、「 <div>タグの中にある文字サイズを20ｐｘの大きさに設定」と言った意味になります。

上記の入力方法は、タグ打ちなどと呼ばれてタグに直接指定をしています。
実際にブラウザで動かしてみましょう。

すると・・・・・