STEP8 : ちょっとしたテクニック 

 今回は今までに説明した以外のちょっとしたテクニックを紹介します。

   
8-1 箇条書き
   8-2 管理人にメール
   8-3 お気に入りに追加
   8-4 コメント
   8-5 スクロールバー付きテキストボックス


 8-1 箇条書き

 何かを列挙したいときに便利な箇条書きです。
使い方は、全体を<ul></ul>タグで囲み、
その中の項目1つ1つを<li></li>タグで囲みます。

書き方見え方
<ul>
<li>杏仁霜</li>
<li>砂糖</li>
<li>粉寒天</li>
</ul>
  • 杏仁霜
  • 砂糖
  • 粉寒天

 また、<ul></ul>タグの代わりに
全体を<ol></ol>タグで囲むと、・が1,2,3になります。

書き方見え方
<ol>
<li>杏仁霜</li>
<li>砂糖</li>
<li>粉寒天</li>
</ol>
  1. 杏仁霜
  2. 砂糖
  3. 粉寒天

このページのトップへ


 8-2 管理人にメール

 クリックすると管理人にメールを送るように自動的にメールソフトを起動させるボタンの作り方です。
 リンクをはるのと同じ要領で、リンク先のアドレスをmailto:メールアドレスとします。

<a href="mailto:メールアドレス"></a>

 またこの時、メールアドレスにつづけて?subject=件名と記述するとメールの件名を指定することもできます。

書き方 <a href="mailto:メールアドレス?subject=リンクの件">メールを送る</a>
見え方 メールを送る

このページのトップへ


 8-3 お気に入りに追加

 クリックするとあなたのサイトをお気に入りに追加できるボタンの作り方です。

 下のコードをコピー&ペーストして、HPのアドレスとHPのタイトルの部分を変えて使ってください。 (「'」や「,」を消してしまわないように注意してください)


このページのトップへ



 8-4 コメントの挿入

 ブラウザには表示されないコメントの挿入の仕方です。
 HTMLでコードを書いていると、後で見直しや修正を行うときに自分でどこに何を書いているのかちょっとわかりにくい時とかがありますよね。
 特にページが長くなってくると、管理が大変です。
 そこで、ブラウザには表示されないようにコメントを入れておくと後から見た時にわかりやすくすることができます。
 コメントは<!--  -->で囲むだけです。

<!-- ここに書かれたことは本当はブラウザには表示されません。 -->

このページのトップへ


 8-5 スクロールバー付きテキストボックス

 結構見かけることも多いのではないでしょうか、下のようなスクロールバーの付いたテキストボックスです。



<textarea cols="70" rows="7"> ここに文章を書きます </textarea >

colsは横の文字数(半角で)、rowsは行数を指定します。

このページのトップへ



←前のSTEPへ  △メニューへ△  次のSTEPへ→

▲サイトTopへ