ねこ好きでHTMLいじりが趣味の主婦が無料で簡単お小遣い稼ぎ♪稼ぐ方法やオススメのお小遣いサイトを紹介!HTMLタグ解説も(*’ω`*)ゞ

▼ねこ好きのお小遣いメモ帳 ....


トップ お小遣い稼ぎ HTMLタグ ブログ お役立ちmemo お料理帳


▼MENU▼


● HTML

はじめに

アップロード


● 文字

文字の大きさ

文字の色

文字の太さ・装飾

文字の位置



● テーブル

基本テーブル

セル結合

テーブル余白

テーブルサイズ

テーブルの位置

シンプル@

シンプルA



● 画像

画像基本

画像にリンク

サイズ変更



● BODY

背景色を変える

文字/リンク色指定

ページの余白



● リンク

リンク基本

ターゲット

下線を消す

マウスオンで下線

マウスオンで下線消し

マウスオンで背景色



● スクロールバー

装飾

非表示



● その他

テキストボックス

ライン







【オススメお小遣いサイト】

◆ ECナビ ◆

【詳しくはコチラ】

◆ GetMoney! ◆
お小遣い稼ぎならポイントサイトGetMoney!
【詳しくはコチラ】

◆ げん玉 ◆

【詳しくはコチラ】

◆ モッピー! ◆
モッピー!お金がたまるポイントサイト
【詳しくはコチラ】




【アフィリエイト】

◆ A8.net ◆

【詳しくはコチラ】


◆ アクセストレード ◆
アフィリエイトのアクセストレード
【詳しくはコチラ】








● はじめに

ホームページをつくってみたい、タグってどう使えばいいの??

そんな時はコピペで簡単に作ってみましょう♪

Q.ホームページをつくるのに、専用のソフトは必要?
A.パソコンに入っている「メモ帳」でつくれます!
スタート⇒全てのプログラム⇒アクセサリ⇒メモ帳で起動します。

Q.専門の知識を覚えないといけない?
A.こういう見た目にしたい!というタグは覚えなくても、コピー&ペーストでOK!


一見、難しそうな文字の羅列でさっぱり・・・見てると頭が痛くなる・・・なんて思うかも知れませんが 一個一個を
きりとって見てみるとどうなっているか判りやすいかと思います。

文字を大きくしたいんだけど・・・
改行させたいんだけど・・・
画像を貼り付けたいんだけど・・・


そんな一個一個の「したい」をタグで指定すれば、全体が作りたかった見た目となります♪





● HTMLについて

HTMLとは、HyperText Markup Languageの頭文字をとったものです。
ウェブページを作成するために開発された言語で、特にこの意味は覚えなくても良いです(;´▽`A``

まず、メモ帳でページを作る際に、「これはHTMLです」と宣言する為、
どのページも<html>から始まり</html>で締めくくります。

???だと思いますが、↓で解説します!


【基本構造】

どのウェブページも、メモ帳で作成する場合は↓のような構造になっています。

<html>
<head>

※ウェブページの全体デザインを指定するところ

</head>
<body>

※ウェブページの実際に見えるところを入力するところ

</body>
</html>


<html>から始まり<html>で締めるというのは、ページ全体で見て
一番上は<html>、一番下は</html>になっているのが分かるかと思います。
※基本的に、タグは<○○>〜</○○>ではさむタイプと、単独で<○○>のみで使う2種類があります。
 はさむタイプは、スラッシュ(/)で締め忘れると、その下へずっとその命令が続いてしまいます。

まず手始めに、↑の枠内をコピーして、新規で起動したメモ帳へ貼り付けてみて下さい。

貼り付けたら、メモ帳の左上「ファイル」⇒名前を付けて保存で保存します。

この時、 ファイル名は必ず半角英数字で保存します。※例:abcdef...1234等

また、半角英数字にして名前を付けて保存しただけでは、そのファイルを開いてみると
ただの↑の内容のメモ帳が起動します。

HTMLページとして開くには、 先ほどの名前の後ろに「.htm」または「.html」という
拡張子を必ず付けて保存
します。※例:test.htm

この名前で保存して、保存したファイルをダブルクリックしてみると、メモ帳ではなく
ウェブページで開くかと思います。

文字だけの味気ないページですが・・・

メモ帳の<body>〜</body>の間に適当に文字を打ち込んで保存後、
ウェブページを開くか更新してみると、その文字が追加されることが分かるかと思います!



------------------------------------------------------------------------------
Q.拡張子って?
ファイルの末尾につけられるファイルを識別する為の文字列のことを言います。
画像でいうと、「.png」「.gif」「.jpg(jpeg)」等があり、パソコンがこの末尾の拡張子でファイルを識別して開きます。
その為、.htmや.htmlを付けないで保存すると、.txtという拡張子になり、メモ帳で開いてしまいます。

Q.タグやファイル名、拡張子は大文字でもいいの?
大文字でも小文字でもどちらでも使えます。
そろえたほうが見た目がごちゃごちゃせずにいいかと思います。

Q.保存する時の拡張子htmとhtmlの違いは?
特にありません。お好みとなります。
昔、拡張子は3文字までという制約がありましたが、今は4文字もOKになりました。

ただ、借りるサーバーによってはトップページ(一番初めのページ)の拡張子を「index.html」で
指定している場合があるので注意です。※私はindex.html以外は全て.htmで保存しています。
------------------------------------------------------------------------------


⇒改行しないのですが・・・

<body>〜</body>の間に文字を書き、メモ帳内でエンターで改行→保存しても、
ウェブページで改行されず、ずっと横に文字が続いてしまっていますよね?

その場合は、面倒ですが改行を指示するタグを挿入します。

改行タグは<br>で、これ一個につき1行改行します。
つまり、2個<br><br>とつければ、2行改行します。

<html>
<head>

※ウェブページの全体デザインを指定するところ

</head>
<body>

※ウェブページの実際に見えるところを入力するところ<br>
test<br><br>

test<br>
test
</body>
</html>


↑これをコピペしてみると、改行されていませんか?

さらに、文字の色を変えたい!となれば↓のようになります。

<html>
<head>

※ウェブページの全体デザインを指定するところ

</head>
<body>

※ウェブページの実際に見えるところを入力するところ<br>
test<br><br>

<font color="blue">test</font><br>
<font color="red">test</font>
</body>
</html>

フォントタグ(<font color="色">〜</font>)ではさみます。 </font>で締め忘れると、その下まで全部命令が
いってしまい変更する予定ではない文字まで変わってしまう為、はさむタグは注意が必要です!


このように、一つ一つの「したい!」を組み合わせてホームページを作っていきます!

はじめは大変ですが、次第に楽しくなるかもしれませんよ笑


そのほかの「したい!」は左メニューよりお探し下さい(:D)rz

※各ページ毎にファイルを作りますので、結構なファイルの量になります。
予めデスクトップ上に新規ファイルを作ってその中へ保存するのがいいと思います。

※↑で作ったページは、現状自分のパソコン上のみ見られます。
みんなが見られるようにするには、サーバーを借りてそこへページをアップロードする必要があります。





▼クリックポチっと応援お願いします♪
お金・懸賞

▼ネットショッピングは楽天市場がオススメ♪







Copyright (C) 2013 ねこ好きのお小遣いメモ帳 All Rights Reserved.

inserted by FC2 system