わかるHP講座

あくまで、管理人自己流です。反論などはメールでお願いします。目標は"専業主婦でも簡単にわかるホームページ講座"です。 何もわからないという方大歓迎です!


別に裏ワザでもなんでもないのですが、少し応用したものや他とは違うものを紹介します。
他とは違うことがしたい!なんて時にオススメです。
長いタグになるものもやあんまり使えなさそうなのもありますが、必要と思えるものだけやっていくのもいいかもしれません(w
下のタグ一覧を開くことをオススメします。

初心者の方 タグ一覧 一通り見る 考え方について

 
■提供タグ■
ここではタグを紹介しています。
タグがほしい人はそのままコピーして張り付ければOK!
覚えたい人は自分で書いてやってみましょう。
赤いタグを<body>〜</body>内の好きなところに入れてください。
青いところは自分で変更OKです。
使った人や覚えた人はBBSで教えてもらえると励みになります。

文字を右に動かす
<marquee direction="right">文字や画像</marquee>
左に動く場合はこちらで。
※IEのみ動きます。 横幅を設定するには<marquee>内にwidth=""を付けます。
 
文字を上に動かす
<marquee direction="up">文字や画像</marquee>
上へ参ります。 ※IEのみ動きます。
縦幅を設定するには<marquee>内にheight=""を付けます。
 
文字を下に動かす
<marquee direction="down">文字や画像</marquee>
クリックできるかな? ※IEのみ動きます。 縦幅を設定するには<marquee>内にheight=""を付けます。
 
文字を左右に動かす
<marquee behavior="alternate">文字や画像</marquee>
※IEのみ動きます。
 
文字を上下に動かす
<marquee behavior="alternate" direction="up">文字や画像</marquee>
※IEのみ動きます。
 
文字を大きくする
<big>文字</big>
HP講座!
1つ大きくなります。
<font size=""></font>の方がオススメです。
 
文字を小さくする
<small>文字</small>
HP講座!
1つ小さくなります。
<font size=""></font>の方がオススメです。
 
罫線の長さを決める
<hr width="数字(%)">


width="100%"


width="70%"


width="40%"


width="10%"

罫線についてはこちらで。


ボタンを作る
<input type="button" value="文字">

押しても効果ないです(w
リンクできるようにする場合はこちらで。
<input type="button" value="文字" style=border-color:"枠の色";background:"背景色";color:"文字色";>

押しても効果ないです(w
リンクできるようにする場合はこちらで。
 
ラジオボタンを作る
<input type="radio">文字
2000 セカンドインパクト
2015 サードインパクト
あぁ、行動が痛い…。
押しても効果ないです(w
リンクできるようにする場合はこちらで。 <input>内にcheckedをつけると最初から選択されます。(1つのみ)
<input type="radio" style=background:"背景色";>
飾りになります。
飾りになる??
なりませんがなにか?
なると言ってみるテスト
背景を変更できます。
押しても効果ないです(w
<input>内にcheckedをつけると最初から選択されます。(1つのみ)
 
チェックボックスを作る
<input type="checkbox">文字
自分が好きです
鏡を見ることが好きです
ナルシストです
押しても効果ないです(w
<input type="checkbox" style=background:"背景色";>
赤は情熱
緑は嫉妬
青は憂鬱
黄色はバナナ
背景を変更できます。
押しても効果ないです(w
 
セレクトボックスを作る
<select>
<option>文字
</select>


選んでも効果ないです(w
キリ番者表示などに使ってる管理人の方もいますね。
<select>〜</select>内に<option>を増やせば項目が増えます。
リンクできるようにする場合はこちらで。
<select>
<option style=background:"背景色";color:"文字色";>文字
</select>


選んでも効果ないです(w
増やし方は上同様。
これは結構飾りつけなるかも。
 
リストボックスを作る
<select size="行数(数字)">
<option>文字
</select>


この場合行数を"4"としています。
<option>を4つ以上使うと見本のようにスクロールできるようになるみたいです。
更新履歴などによく使ってる管理人の方がいますね。
<select size="行数(数字)">
<option style=background:"背景色";color:"文字色";>文字
</select>


色つきバージョン。
シンプルの方がよいかも??
 
マークつきリストを作る
<ul type="種類">
<li>文字</li>
<li>文字</li>
<li>文字</li>
</ul>

  • type="disk"
  • 黒丸で
  • 表示されます。
  • type="circle"
  • 白丸で
  • 表示されます。
  • type="square"
  • 黒四角で
  • 表示されます。

 
番号つきつきリストを作る
<ol>
<li>文字</li>
<li>文字</li>
<li>文字</li>
</ol>

  1. 今日の予定
  2. 明日の予定
  3. これからの予定
自動で番号ふってくれます。
便利!!
(でも、いつ使うんだろう?)
 
記入欄を作る
<input type="種類(※下参照)" size="長さ(数字)">

type="text"→テキストで表示
type="password"→*****で表示
type="text"

▲▼実際記入してみてください

type="password"
<textarea rows="行数(数字)" cols="長さ(数字)">最初の文字</textarea>


BGMを流す
<embed src="音楽ファイル名" autostart="true/false" hidden="true/false" loop="true/false">
実際ここでも流してますね。

autostart="" 自動でスタートさせるかどうか。trueならさせる。
hidden="" 曲バーを隠すか隠さないか。trueなら隠す。
loop="" 繰り返すか繰り返さないか。trueなら繰り返す。

※他人のMIDIファイルを許可なしで使用すると犯罪になります。必ず許可を得たもの、または自分で作成したものを使ってください。
 
ウィンドウ内にフレームを作る
<iframe src="ファイル名" width="横幅(数字)" height="縦幅(数字)">エラーメッセージ</iframe>
リンク方法

手順@
名前を付ける。
<iframe src="ファイル名" name="名前">エラーメッセージ</iframe>

手順A
リンクを貼る。
<a href="ファイル名" target="名前"></a>


↓メニュー↓

裏ワザ講座
裏ワザ一覧
画像もOK
戻る


 
■考え方■
あとがき。

裏ワザに関しては、考え方なんかは必要ないのであとがきを書きます。
たぶん、最初のはじめましょうからここまですべてやってくれた方は、1人か2人…、またはいないかもしれません。
しかし、この講座を少しでも役に立ったって方なら少しはいると思います。 (いるかな?)
そんな方にお願い。
感想聞かしてください。
これを書いてる段階はまだ未公開ですが、公開してもここが繁栄することはないでしょう(w
なので、そっとでいいのでBBSに感想を聞かしてください。
そして、できたHPと相互リンクを貼りましょう。(お互いリンクを貼ること)
それが自分の夢です(ぉぃ

質問・感想・訂正などございましたらBBSへ気がるによろしくお願いします。

タグコピペしたら投票よろしくお願いします。

来るたびに投票してもらえるとよりうれしい…(ぉぃ



初心者の方 タグ一覧 一通り見る 考え方について



Gポイントポイ活 Amazon Yahoo 楽天

無料ホームページ 楽天モバイル[UNLIMITが今なら1円] 海外格安航空券 海外旅行保険が無料!