HTML5で追加されたtimeタグについて使い方用例を説明します。timeタグは時刻・日付・年を表します。 timeの表 カテゴリ…続きを読む
HTMLリファレンス
HTMLはホームページを作る際のベースとなるものです。
これをタグと言います。この部分を開始タグ、この部分を終了タグと言います。他にも様々なタグがあり、これらのタグを組み合わせてホームページを作っていきます。ブラウザはこの書き方を認識して、ホームページとして表示してくれます。
もしHTMLだけのホームページでしたら、真っ白な画面に文章だけが表示されている状態になります。このページでは、HTMLのタグについて基本的なものを紹介しています。リファレンスとしてご利用ください。
また、ブラウザでご覧になっているホームページのソースコードを見ることができます。Google Chromeであれば「表示」「開発/管理」「ソースを表示」の順番で確認できます。
HTML5.1の概要
HTML構文とXHTML構文を選択できますが、ここで紹介するのはより普及しているHTML構文での書き方になります。HTML5ではHTML4を基本として新しいタグが採用されていますので、HTML4を学んだことがある方は変更点を押さえておけばいいでしょう。大きな変更点は要素の定義です。要素には7つの定義があり。フローコンテンツ・ヘッディングコンテンツ・セクショニングコンテンツ・フレージングコンテンツ・組み込みコンテンツ・インタラクティブコンテンツ・メタデータコンテンツに分類されます。文脈によって使用するタグを考えて構成する必要があります。これが大きな変更点です。HTML5では文脈に合わせてコンテンツを表現する必要があるということです。
全体 | html | ホームページの骨格部分となる最初に記述するタグ。html、head、bodyについて。HTMLを構成する基本タグ 「枠組み部分」 |
---|---|---|
メタデータ | meta | ホームページには表示されない内部情報を指定するタグ。meta、title、link、styleについて。metaデータを表すタグの基本 |
構造 | h | コンテンツの見出しを表すタグ。hタグ |
p | 文章の段落を表すタグ。pタグ | |
div | 大きなひと塊りのグループを作るタグ。div | |
span | 小さなひと塊りのグループを作るタグ。spanタグ | |
hr | 横線でコンテンツを仕切るタグ。hrタグ | |
リスト | ulとol | リストを作るタグ ol/ul違いがある。ol/ul |
dl | 対話的表現方法、日付と項目などに利用するタグ。dl | |
テキスト | a | ページ遷移のためのリンクを設定するタグ。aタグ |
br | pタグ内で改行したい場合に使用するタグ。br | |
strong | 太文字で強調するタグ、検索エンジンに重要なキーワードを伝える役目もある。strong | |
em | 斜線による強調をするタグ。em | |
pre | 空白をそのまま表示するタグ、歌詞やコードなどに使用する。pre | |
メディア | img | イメージ画像を挿入するタグ。img |
フォーム | form | お問い合わせフォームなどに使用し、サーバーにデータを送信するタグ。form |
input | formタグと共に使い、入力エリアなどを作るタグ。input | |
selectとoption | 選択ボックスなどを作るタグ。select/opiton | |
textarea | 文字量のおおい場合に利用する入力エリアを作るタグ。textarea | |
表 | table | 表を作るタグ。table |
caption | 表のタイトルを表すタグ。caption | |
その他 | 記号 | キーボードにない記号を表示するタグ。文字参照(記号) |
time | 時刻・日付・年を表すタグ、キャンペーンや特定の時代を表示する場合に使用する。time |
select option要素の使い方
selectとoptionはセットで使用し、フォームやアンケートなどホームページの部品を作る際に使います。formタグと一緒に使い…続きを読む
textareaの使い方
textareaを使うことで、問い合わせフォームのコメント欄やホームページ更新履歴などのデザイン部分にも利用することができます。こ…続きを読む
tableタグ「表」の作り方
HTML5になり、今まで利用していた属性の多くが非推奨となりました。 デザインはスタイルシートに書くようにしてください。 詳しくは…続きを読む
HTMLで記号を入力するには?「文字参照」
下記の文字はHTMLとして認識されますので、ブラウザで表示するには特殊な文字を入力する必要があります。 よく使用するものを掲載して…続きを読む
spanタグの使い方
spanはスタイルシートを指定するための汎用的なタグです。ですので、ホームページのデザインを反映させるために使います。このタグ自体…続きを読む
strong/b/emタグの使い方
strongタグを指定するとほとんどのブラウザでデフォルトの状態で太文字で表示されます。使用する場所は強調したい単語、センテンスな…続きを読む
metaデータを表すタグの基本
meta要素はブラウザには表示されない内部情報を掲載または指定するものです。 特に検索エンジンやソーシャルメディアに特定の情報を伝…続きを読む
ol/ulタグの使い方と違いについて
olとulタグはリストを作る要素です。olは順番を表示し、ulは順不同のリストを作る際に利用します。 HTML5になり追加された属…続きを読む
inputタグの使い方
input要素は属性によって機能が多岐に渡ります。 このページでは初心者向けに基本的な機能を掲載しています。 inputタグ カテ…続きを読む
HTMLを構成する基本タグ 「枠組み部分」
HTML4.0からHTML5へと移行しました。HTML5は2014年10月28日に勧告され、正式に利用されるようになりました。これ…続きを読む
formタグの使い方
formはサーバーにデータを送信するための仕組みです。GETメソッド・POSTメソッドの違いについて解説します。 form要素の表…続きを読む