イメージ画像

最新情報(リストタグを使ったシンプルなパターン)

  • 2010年6月1日
    TOPページのみ、パン屑ナビに<h1>が入っています。
    他のページは、メインコンテンツ最初の見出しが<h1>になっています。
  • 2010年6月1日
    サイトリニューアルしました!
  • 2010年6月1日
    サイトリニューアルしました!

最新情報(定義タグとアイコンを使ったパターン)

2010年6月1日ニュース
ここにテキストが入ります。ここにテキストが入ります。
2010年6月1日PR
ここにテキストが入ります。ここにテキストが入ります。
2010年6月1日新商品
ここにテキストが入ります。ここにテキストが入ります。
2010年6月1日新商品
ここにテキストが入ります。ここにテキストが入ります。
2010年6月1日新商品
ここにテキストが入ります。ここにテキストが入ります。

H2用のテキストが入ります。

H3用のテキストが入ります。

H3用のテキストが入ります。

H4用のテキストが入ります。

H4用のテキストが入ります。

「divタグ(boxクラス)」を使って左右に並べた例

サイト制作が楽になるソフト一覧

  1. テキストエディタ「Crescent Eve」

    フリーのテキストエディタ。
    「F7」を押せばHTMLのエラーチェックができる他、タグを自動的に予測入力してくれる機能もある。

  2. 文字列一括置換ソフト「Devas」

    全ページのタイトル等を一括で変更したいときにオススメ。

  3. FTPソフト「FFFTP」

    作成したホームページファイルをサーバへアップ(転送)するFTPソフトです。

  4. 文字コード変換ソフト
    「KanjiTranslator」

    ドラッグ&ドロップだけでファイルの文字コードを変換することができます。
    ただし、HTMLソース内の文字コード表記も変更するようにしてください。

  5. 疑似サーバ環境作成ソフト「XAMPP」

    お使いのPCにインストールすることで、疑似サーバ環境を作成できます。PHPやMySQLなどのテストが可能になります。

無料配布ベスト5

「リストタグ(checklist)を使った例

  • ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。
  • ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。
  • ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。

「テーブルタグ」を使った例

おすすめのサービス 評価(5段階) 詳細
サンプルバナー ★★★★★ ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。
サンプルバナー ★★★★☆ ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。
サンプルバナー ★★☆☆☆ ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。

本テンプレートでは「advanced.css」の中に便利なCSSの設定をご用意しています。

1、文字色を変える

  • 文字色を黒色に変更することができます。
  • 文字色を赤色に変更することができます。
  • 文字色を青色に変更することができます。
  • 文字色を緑色に変更することができます。
  • 文字色を黄色く変更することができます。
  • 文字色を紺色に変更することができます。
  • 文字色を灰色に変更することができます。
  • 文字色をオレンジに変更することができます。
  • 文字色をピンクに変更することができます。
  • 文字色を紫色に変更することができます。
  • 文字色を黄土色に変更することができます。
  • 文字色を黄緑に変更することができます。
  • 文字色を水色に変更することができます。

2、文字の大きさを変える

  • 文字を太字にすることができます。
  • 文字を「120%」の大きさにすることができます。
  • 文字を「150%」の大きさにすることができます。
  • 文字を「180%」の大きさにすることができます。
  • 文字を「80%」の大きさにすることができます。

3、下線や取消線を引く

  • 文字に下線を引くことができます。
  • 文字に取り消し線を引くことができます。

4、文字列を「蛍光ペンのようなボックス」で囲む

  • 文字を黄色いボックスで囲むことができます。
  • 文字に水色のボックスで囲むことができます。
  • 文字に灰色のボックスで囲むことができます。
  • 文字に赤色のボックスで囲むことができます。

5、文字列の前にアイコンを付ける。

先頭にCHECK!という画像が付いた状態で表示されます。

先頭にCHECK!という画像が付いた状態で表示されます。

先頭にPOINT!という画像が付いた状態で表示されます。

先頭にPOINT!という画像が付いた状態で表示されます。

先頭に注意!という画像が付いた状態で表示されます。

先頭に注意!という画像が付いた状態で表示されます。


先頭に初心者マークが付いた状態で表示されます。

先頭にメール画像が付いた状態で表示されます。

先頭にPDF画像が付いた状態で表示されます。

先頭にZIP画像が付いた状態で表示されます。

先頭にRSS画像が付いた状態で表示されます。


一行なら文章の終わりにも使えます。

一行なら文章の終わりにも使えます。

このページの先頭へ