HTML5

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <meta name="keywords" content="HTML5,雛形"> <meta name="description" content="HTML5の雛形です。"> <title>HTML5 雛形</title> <link rel="icon" href="favicon.ico"> <link rel="icon" href="favicon.svg" type="image/svg+xml"> <link rel="stylesheet" href="css/style.css"> <script type="text/javascript" src="js/script.js"></script> </head> <body> <p> HTML5 雛形 </p> </body> </html>

link

同じタブで開く

新規タブで開く(内部向け)

新規タブで開く(外部向け)


table

スタイルシート

<style> table { border-collapse: separate; /* border-collapse: collapse; */ } table, th, td { border: 1px blue solid; } </style>

HTML

<table> <caption>caption</caption> <tr><th>h-1</th><th>h-2</th></tr> <tr><td>d-1</td><td>d-2</td></tr> </table>

list

<ul> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> </ul>

入れ子(親リストの<li>タグ内に記述)

<ul> <li>親リスト1 <ul> <li>子リスト11</li> <li>子リスト12</li> <li>子リスト13</li> </ul> </li> </ul>

番号付きリストは、「ul」→「ol」


form

スタイルシート

<style> label, input[type="checkbox"] { cursor: pointer; /* ラベルとチェックボックスのマウスカーソルをポインタ(指マーク)に変更 */ } textarea { vertical-align: top; /* ラベルの名前を上寄せにする */ height: calc( 1.3em * 5 ); /* テキストエリアの高さを行数で指定する */ line-height: 1.3; /* 行高さを指定する */ } </style>

HTML

<form action="sample.php" method="post"> <div> <label for="name">名前</label> <input type="text" id="name" name="name" placeholder="名前を入力" required autofocus> </div> <div> <label for="color_checkbox1"> <input type="checkbox" id="color_checkbox1" name="colors[]" value="white"></label> <label for="color_checkbox2"> <input type="checkbox" id="color_checkbox2" name="colors[]" value="black" checked></label> <label for="color_checkbox3"> <input type="checkbox" id="color_checkbox3" name="colors[]" value="red"></label> </div> <div> <label for="pref">都道府県</label> <select id="pref" name="pref"> <option value="01">北海道</option> <option value="02" selected>青森県</option> <option value="03">岩手県</option> </select> </div> <div> <label for="comment">コメント</label> <textarea id="comment" name="comment" required></textarea> </div> <div> <button type="submit">登録</button> </div> </form>

顔文字

(^^;

(^^ゞ

(T_T)

(>_<)

(^o^)v

(ーー;)

(^O^)/

m(_ _)m

( ̄□ ̄;)

(+_+) 気絶中

( ̄ー+ ̄)キラリ

φ(.. )メモメモ

(-。-)y-゜゜゜゜

(・o・)ゞ了解!

てへぺろ(・ω<)

バキッ!!☆/(x_x)

(o_ _)ノ彡☆ギャハハ!! バンバン!

キタ━━━━(゚∀゚)━━━━ッ!!


特殊文字

< &lt;
> &gt;
' &apos;
" &quot;
& &amp;
¥ &yen;
&hearts;
© &copy;
  &nbsp;
&#8629;
&#9166;
&#9251;
&#9728;
&#9770;
&#9993;
&#10004;
💢 &#128162;
&#9312;
&#9313;
&#9314;
&#9315;
&#9316;
&#9317;
&#9318;
&#9319;
&#9320;
&#9321;
&#10102;
&#10103;
&#10104;
&#10105;
&#10106;
&#10107;
&#10108;
&#10109;
&#10110;
&#10111;

例示専用のドメインと IP アドレス


コメントアウト

<!-- コメントアウト -->

- guitar site WAVE -