得するインターネットの活用法

ホームページを作ろう
・超初心者向けHTML講座
・超初心者向けHTML講座2
・無料HPスペースとFTP転送

得するインターネットの活用法
得するインターネットバンキング
得するポイントサイト
インターネットで副業

超初心者向けHTML講座

初歩的なHTMLの紹介です。私も初心者なので、高度な解説は無理です。また、他のOSの方には大変申し訳ないですがWindowsXPしか判りません。
でも、ホームページ作成ソフトでホームページを作るにしても、多少の知識はあったほうがいいと思います。

PCの設定

まずやっておく事があります。(WindowsXPの場合)

拡張子が表示されるようにします。
マイコンピュータ → コントロールパネル → フォルダオプション → 表示タブを選択  → 登録されているファイルの拡張子は表示しないのチェックをはずす

これでOKです。これをしないとメモ帳で作ったHTMLファイルを保存できません。

作業用のフォルダを作る。
HTMLファイルの格納先フォルダを作ります。MYホームページなどわかりやすい名前をつけて、作ったファイルなどをここに格納します。

このフォルダは、あなたのPC内にあるのであなたにしか見れません。
ホームページスペースとは、このフォルダがWeb上にあるものと考えればわかりやすいと思います。

HTMLとは

HTML文書とは、ブラウザにどのようにホームページを表示するかの指示が書かれています。タグと言う物を使います。

<HTML> ここからHTML文書が始まり
</HTML> ここで終わります。
< と > までがタグです。全て半角で書きます。また大文字と小文字の区別はありません。

基本的なホームページのつくり
HTML文書実際の表示
<html>(ここから始まる)
<head>(ページのタイトルなど情報)
<title>MYホームページ</title>
</head>

<body>(実際に表示される内容)
  ホームページ作ったよ
  <br>(改行のタグ)
私の趣味のページです
</body>(ここまで表示される)
</html>(ここで終わり)
ホームページ作ったよ       
私の趣味のページです

<head>から</head>の間には、そのページの情報などが入ります。基本的にこの部分は表示されません。
しかし<title>と</title>の間にあるページのタイトルは、例えばInternetExplorerの上のほうにあるタイトルバーに表示されます。
また、このように基本的に始まり終わり(/が入っている)のタグ、二つセットになります。

bodyタグの間にあるのが、実際に表示される部分です。
<br>は改行のタグで、これがある場所で改行されます。間に空白の行を入れたいときは<br><br>とすれば一行の空白が入ります。<br>は終わりのタグはいりません。

上の例だと

    ホームページ作ったよ
    <br>
  私の趣味のページです

と書いても

    ホームページ作ったよ<br> 私の趣味のページです

と書いても、実際の表示は同じになります。

文字の装飾

HTML文書をワープロソフトなどで文章を色々装飾して作っても、タグで指示しない限りホームページの表示には関与しません。

文字の色
文字の色を指定するには、<font color=" ">タグを使います。色指定したい文字 を<font color=" ">(開始タグ)と</font>(終了タグ)で挟みます。
色は、” と ” の間に色の名前かカラーコードで指定します。
このfontが、タグの種類を表し、colorが属性となります。両者の間に半角のスペースが入ります。
black
#000000
gray
#808080
silver
#c0c0c0
white
#ffffff
blue
#0000ff
navy
#000088
teal
#008080
green
#008000
aqua
#00ffff
lime
#00ff00
yellow
#ffff00
magenta
#ff00ff
olive
#808000
purple
#800080
maroon
#800000
red
#ff0000
名前の下にあるのがカラーコードです。
<font color="black">と<font color="#000000">は同じになります。

HTML文書実際の表示
<body>
<font color="blue">ホームページ</font>
 作ったよ<br>
私の趣味のページです
</body>
ホームページ作ったよ   
私の趣味のページです


文字の大きさ
文字の大きさを指定するには、<font size=" ">タグを使います。sizeが属性ですね。 大きさは数字で1〜7の7段階に指定することができます。
size="1"
size="2"
siza="3"
size="4"
size="5"

size="6"

size="7"

文字の強調(太字)、斜体
太字は<b></b>、斜体は<i></i>です。

HTML文書実際の表示
<body>
<font color="blue" size="4">
<b>ホームページ</b></font>
作ったよ<br><br>
 私の趣味のページです
</body>
ホームページ作ったよ   

私の趣味のページです

上の例のようにfontタグに属性を二つ含める場合にも半角スペースが入ります。

他にも下線<u>下線を引きたい文章</u>や、
文字の打ち消し線<s>打ち消し線を引きたい文章</s>などあります。
下線を引きたい文章
打ち消し線を引きたい文章

横位置の指定

上の下線や打消し線の例が、それまでと違って中央に表示されています。
このように横位置を指定するタグは<DIV align=" "></DIV>で、DIVタグに属性align=" "をつけます。

<DIV align="left">左寄せ</DIV><br>
<DIV align="center">中央</DIV><br>
<DIV align="right">右寄せ</DIV>

左寄せ

中央

右寄せ

特に指定していなければ左寄せとなります。

ページの背景に色をつける

<body>に属性を示す『bgcolor』をいれます。 <body bgcolor=" ">というタグになります。色の指定は、文字の色を指定したときと同様に、色名か、カラーコードを使います。

HTML文書実際の表示
<body bgcolor="#00ffff">
<font color="blue" size="4">
<b>ホームページ</b></font>
作ったよ<br><br>
私の
<font color="purple"><b>
 趣味のページ</b></font>
です
</body>
ホームページ作ったよ   

私の趣味のページです

同様にbackground=" "で、背景画像を指定できます。画像についてはあとで説明します。