×

[PR]この広告は3ヶ月以上更新がないため表示されています。
ホームページを更新後24時間以内に表示されなくなります。

HTML(初級編)

初級のhtmlになります、お暇でしたら参考にしてください。

リンク、改行、文字の色、サイズ、太く、センタリング、斜体、アンダーライン、

取り消し線、テロップ、点滅や表。

HTML  初級編
--------------------------------------------------------------------------------
[ HOME  ] 【体に良いもの見つけ隊】

--------------------------------------------------------------------------------
●目次
--------------------------------------------------------------------------------

・タグについて説明 
・文章を改行したい
・他のページにリンクを張りたい 
・文字の色を変えたい 
・文字の大きさ(サイズ)を変更したい
・文字を太くしたい
・文字をセンタリング(中央揃え)したい 
・文字を斜体で(ななめに傾けて)表示したい
・文字にアンダーライン(下線)をつけたい 
・文字に取り消し線をつけたい
・文字をテロップのように動かして表示したい
・文字を点滅させたい
・表(テーブル)を書きたい
・あなたのサイトをお気に入りに追加できるリンクのソース

・サイトマップ


--------------------------------------------------------------------------------


●まず、タグについて説明

タグ(tag)は、「この部分をセンタリング!」とか、「ここは文字を大きく!」って命令するコマンドのこと。


ほとんどのタグは、開始タグ(「<****> 」と、終了タグ</****> 」のペアでひとつの命令になっています。



開始タグと、終了タグ半角英数で入力!(例)→<CENTER> </CENTER>



日本語文章全角/ひらがな(Hで入力!(例)→この部分をセンタリング!

タグ(半角英数)日本語文章を組み合わせて入力→ <CENTER>あいうえお!</CENTER>
表示はこうなります→ あいうえお!


通常のテキストファイルと違ってHTML文書は、通常の改行やインデントが関係ないので、

次のように書いても意味は同じになります。

<CENTER>
この部分をセンタリング!
</CENTER>


▲このページのTOPへ
▲HOME


--------------------------------------------------------------------------------
●文章を改行したい

文章を改行したいところに半角英数<BR>と入力

[HTMLタグ]半角英数で入力


あいうえお<BR>


[完成例]

あいうえお<BR>
かきくけこ<BR>

と書くと...


あいうえお
かきくけこ

のように文字が表示されます。

▲このページのTOPへ ▲HOME


--------------------------------------------------------------------------------

●他のページにリンクを張りたい

[ 表示例 ] 「Yahooジャパンへリンク」


[HTMLタグ]半角英数で入力


<a href=”http://www.yahoo.co.jp/“>Yahooジャパン</a>


自分のホームページを他のホームページとリンクをさせたい時は、

<a href="リンク先のアドレス">リンク先のホームページの名前</a>


と書くと

文字をクリックして他のページにジャンプできるようになります。

(アドレスとは、Yahooジャパンの場合「http://www.yahoo.co.jp/」 のようにhttp://で始まるものをさします)


[完成例]

<a href="http://http://www.yahoo.co.jp/">Yahooジャパン</a>へジャンプ


と書くと...

Yahooジャパンへジャンプ

のようにYahooジャパンへジャンプ できるようになります。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字の色を変えたい

[ 表示例 ] 文字の「色を」変える

[HTMLタグ]半角英数で入力


<font color=”blue”></font>


色を変えたい文字を<font color="色名">と</font>でくくると、
文字の色を変えることができます。(red,blueなど)


※color="色名"の色の部分を変えると他の色にすることもできます。
↓のようにblueやgreenなど様々な色が使用できます。
white black gray blue
cyan green lime khaki
yellow orange brown red
pink purple violet Aqua


#FFFFFFのようにカラーパレットで指定することも可能です。


[完成例]

ここから先が <font color="blue"> 青く </font> なります。


と書くと...

ここから先が 青く なります。


のように文字が色をかえて表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字の大きさ(サイズ)を変更したい

[ 表示例 ] 文字を「大きく」表示させる

[HTMLタグ]半角英数で入力


<font size=”7”>大きく</font>表示させる


大きさを変えたい文字を<font size="サイズ"></font>でくくると、
文字の大きさを変えることができます。(1〜7まで)


※size="サイズ"の色の部分を1〜7の数字に変えると文字の大きさを変えることができます。
 のように、1がもっとも小さく7がもっとも大きいサイズとなります。


※また、見出しの文字のサイズは<h1〜6>タグで変更することもできます。
この場合、サイズの指定は<h1>と</h1>がもっとも大きくなり、
<h6>と</h6>でくくった場合がもっとも小さくなります。


[完成例]

ここから先が <font size="7"> 大きく</font> なります。


と書くと...

ここから先が大きくなります。


のように文字がサイズを変えて表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字を太くしたい

[ 表示例 ] 文章を「太字で」表示する

[HTMLタグ]半角英数で入力


<b>太字</b>で表示する


太くしたい文字を<b>と</b>でくくると、その文字を太く表示することができます。


[完成例]

ここから先が <b> 太く </b> なります。


と書くと...

ここから先が 太く なります。


のように文字が太くなって表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字をセンタリング(中央揃え)したい

[ 表示例 ] 文字を↓

「センタリングする 」

[HTMLタグ] 半角英数で入力


<center>
センタリングする</center>


センタリングしたい文字を<center>と</center>でくくると、 文字をセンタリングすることができます。


[完成例]

<center>中央に表示されます。</center>


と書くと...


                            中央に表示されます。

のように文字が中央揃えになって表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字を斜体で(ななめに傾けて)表示したい

[ 表示例 ] 文章を「斜体で」表示する

[HTMLタグ] 半角英数で入力


<i>斜体で</i>で表示する


[完成例]

ここから先が <i> 斜体に </i> なります。


と書くと...


ここから先が 斜体に なります。

のように文字が斜体になって表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字にアンダーライン(下線)をつけたい

[ 表示例 ] 文章に「アンダーライン」をつける

[HTMLタグ]


文字に<u>アンダーライン</u>をつける


アンダーラインしたい文字を<u>と</u>でくくると、
その文字にアンダーラインをつけられます。


[完成例]


ここから先が <u> アンダーラインに </u> なります。


と書くと...

ここから先がアンダーラインになります。


のように文字にアンダーラインがついて表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字に取り消し線をつけたい

[ 表示例 ] 文字に「取り消し線」をつける

[HTMLタグ]半角英数で入力


<s>取り消し線</s>をつける


[完成例]


ここから先に <s> 取り消し線が </s> つきます。


と書くと...

ここから先に取り消し線がつきます。


のように文字に取り消し線がついて表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字をテロップのように動かして表示したい

[ 表示例 ] 文字を「テロップのように動かす」

[HTMLタグ] 半角英数で入力


<marquee>テロップのように動かす</marquee>


※このHTMLタグは、利用者の環境によっては正常に動作しない場合があります。
(Internet Explorerのみで動作し、Netscape Navigator では動作しません。)


[完成例]

<marquee>テロップのように動きます</marquee>


と書くと...

テロップのように動きます



のように文字が動いて表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●文字を点滅させたい

[ 表示例 ] 文字を「点滅させる」

[HTMLタグ] 半角英数で入力


<blink>点滅させる</blink>


※このHTMLタグは、利用者の環境によっては正常に動作しない場合があります。


点滅させたい文字を<blink>と</blink>でくくると、 文字を点滅させて表示することができます。


[完成例]


<blink>文字を点滅させます</blink>


と書くと...


点滅させます

のように文字が点滅して表示されます。

▲このページのTOPへ ▲HOME



--------------------------------------------------------------------------------

●表(テーブル)を書きたい

[ 表示例 ]
ショッピング スポーツ用品
ホームページ Yahooジャパン


[HTMLタグ] 半角英数で入力


<table>
<tr><td>ショッピング</td><td>スポーツ用品</td></tr>
<tr><td>ホームページ</td><td>Yahooジャパン</td></tr>
</table>


表を書くには<table>を使用します。<tr>と</tr>でくくられた横の部分が行となり

<td>と</td>でくくられた 部分が縦の列となります。

これらを<table>と</table>でくくると、表として表示されます。



※</table>などの終了タグを書き忘れた場合、ページが表示されない場合があるのでご注意ください。

<table>
<tr><td>1行目の1列目</td><td>1行目の2列目</td></tr>
<tr><td>2行目の1列目</td><td>2行目の2列目</td></tr>
</table>


2.上の文字を全て選択し、右クリックでコピーして、ページ作成などの入力画面にはりつければ

表を書くことができます。


※border="数字"の部分は表の線の太さになります。


[完成例]


<table border="1">
<tr>
<td>1行目の1列目</td><td>1行目の2列目</td><td>1行目の3列目</td>
</tr>
<tr>
<td>2行目の1列目</td><td>2行目の2列目</td><td>2行目の3列目</td>
</tr>
</table>


と書くと...

1行目の1列目

1行目の2列目

1行目の3列目

2行目の1列目

2行目の2列目

2行目の3列目


と表になります。

▲このページのTOPへ ▲HOME

------------------------------------------------------------------------------


●あなたのサイトをお気に入りに追加できるリンクのソース

[ 表示例 ]

お気に入りに追加


上の例のようにワンクリックであなたのサイトをお気に入りに追加できるリンクのソースを

以下に掲載しました。あなたのサイトのURLとタイトルを記入し、

サイトの表示したいところに貼り付けるだけでご利用いただけます。

「お気に入りに追加」HTMLソース


<a href="javascript:window.external.AddFavorite('http://サイトURL','サイトのタイトル')">お気に入りに追加</a>


------------------------------------------------------------------------------

▲このページのTOPへ
▲HOME




[  サイトマップ  ]
■健康食品
|-
|-酸素
|-血液サラサラ
|-フコイダン
|-アガリクス、茸

|-きれいな水
|-コエンザイムQ10
|-アルファリポ酸
|-青汁
化粧品、メイクアップ
|-化粧水
|-ファンデーション
|-美肌、お肌のお手入れ

■フェイスケア
|-シミ、くすみ
|-シワ、たるみ
|-にきび、毛穴
|-美白
■ボディケア
|-石鹸、ソープ
|-体臭
|-腸内の調整に
|-腸内洗浄
ヘアケア
|-ムダ毛・脱毛・除毛
|-育毛、毛髪


ダイエット食品
|-サプリメント
|-麺類
|-飲料

■ダイエット用品
|-バストアップ
|-ウエア、パンツ
|-ヌーブラ
リラクゼーション
|-癒しグッズ
|-安眠、不眠症
|-マイナスイオン

|-ゲルマ二ウム
■レディス・ケア
|-コンドーム
|-パワーリングネオ
|-ラブコスメ
|-オリモノ対策
■メンズケア
|-ED(勃起不全)
|-サイズアップ

|-疲れ目、視力回復

■鼻
|-イビキ

|-花粉対策
■口
|-禁煙
|-歯ブラシ
■耳
|-耳鳴り
■足
|-フットケア
■香水
|-女性
|-男性

その他
|-商品を安く買うウラ技
|-アマゾンカテゴリー
|-

■ビジネス
|-情報起業最短コース 
|-ヤフオクで情報起業









[ このページのいちばん上へ 
 ]  [  HOME ]   [ 日記・ブログ  健康の架け橋 / 健康美隊 ]

------------------------------------------------------------------------------