HTML要素 索引
最終更新日:2022年08月23日 (初回投稿日:2010年08月31日)※このページは記事を掲載後、順次更新していきます。
- a
- [11-1] 他のページにリンクしよう
- [11-2] リンクの文字の色を変えよう(CSS使用)
- [11-3] 同じページ内でリンクしよう
- [11-4] 別のページの特定の箇所にリンクしよう
- [11-5] 画像にリンクを貼ろう
- [11-6] ボタン画像をマウスオーバー時に変化させよう(CSS使用)
- abbr
- [29] <abbr>で略語を示そう
- [30] 定義語を示す<dfn>を、<abbr>や<dt>と一緒に使おう
- address
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-5] ヘッダーの header、フッターの footer、連絡先の address要素
- area
- [61] イメージマップ(リンク領域)を作ろう map要素・area要素
- article
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-2] セクショニングの article要素、aside要素、section要素
- [17-3] セクショニング要素と見出し要素のルール
- aside
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-2] セクショニングの article要素、aside要素、section要素
- [17-3] セクショニング要素と見出し要素のルール
- audio
- [66] 音声をプラグイン無しで組み込もう <audio><source>
- [67]「mediagroup属性」でメディア要素を同期させよう
A
- b
- [23] <b><i><small>もまだ使えます
- base
- [41] <base>でベースのURLを示そう
- bdi
- [34] 書字方向を指定する bdo要素と 書字方向を隔離する bdi要素
- bdo
- [34] 書字方向を指定する bdo要素と 書字方向を隔離する bdi要素
- blockquote
- [28] blockquoteで「引用されたブロック」を示そう
- body
- [2] タイトル(title要素)を設定しよう
- [13-1] サイトの背景に色をつけてみよう
- [13-2] サイトの背景に画像を表示しよう
- [13-3] サイト背景にCSS3で線形グラデーションをつけよう (CSS使用)
- br
- [5] テキストを改行(<br>)してみよう
- button
- [50] button要素で送信・リセット・汎用ボタンを自由に作ろう
B
- canvas
- [69-1] canvas要素でグラフィックスを表示する領域を作ろう
- [69-2] Canvasに基本的な図形を描こう
- [69-3] Canvasに曲線を描こう(線のスタイルも)
- [69-4] Canvasに画像を描画しよう(トリミングやクリッピングも)
- [69-5] Canvasにグラデーションやパターン、シャドウを指定しよう
- [69-6] Canvasにマウスの動きに合わせて描画しよう
(クリックやマウスムーブとの組み合わせと Math.random) - [69-7] Canvas上の重なった描画領域を指定しよう
(globalCompositeOperationプロパティ) - [69-8] Canvasでテキストを描画しよう
- (ちょっとメモ)Canvasで便利な javaScriptライブラリ
- [69-9] Canvasでグラフィックスの変形をしよう(拡大・回転・移動・反転など)
- [69-10] Canvasの描画の状態を保存・復元する save() と restore()
- [69-11] Canvasでビットマップを操作しよう(ビットマップの明度や色調の変更)
- [69-12] Canvasをサイトの背景に使おう
- (ちょっとメモ)CanvasサイズをCSS3のvw, vhで取得してみたけど...
- [69-13] Canvasで画像データをURLとして取得しよう
- (ちょっとメモ)Canvasでグラフを自動生成する「flotr2」が便利
- [69-14] Canvasのアニメーションの基本を見てみよう
- (ちょっとメモ)API って何だ?(HTML5 の API について)
- caption
- [16-2] table にタイトルをつけよう(caption)
- cite
- [26] 参照先のタイトルを表す<cite>を使おう
- code
- [31-1] <code> と <pre> でソースを表示しよう
- col
- [16-6] table縦列グループ化(colgroup, col)
- colgroup
- [16-6] table縦列グループ化(colgroup, col)
C
- data
- [32] その他のプログラム関連を示す samp、kbd、var、data要素
- datalist
- [52] 入力候補のリストを作ろう datalist要素
- dd
- [15-3] 説明リストを作ろう( dl要素・dt要素・dd要素)
- [15-7] リストでナビゲーション( dl要素・dt要素・dd要素)
- defs
- [70-2] SVGフィルターを使ってみた
- del
- [24] 追加を示す<ins>と、削除されたことを示す<del>を使おう
- dfn
- [30] 定義語を示す<dfn>を、<abbr>や<dt>と一緒に使おう
- div
- [7] <div>や<span>で特定の範囲を指定しよう
- dl
- [15-3] 説明リストを作ろう( dl要素・dt要素・dd要素)
- [15-7] リストでナビゲーション( dl要素・dt要素・dd要素)
- dt
- [15-3] 説明リストを作ろう( dl要素・dt要素・dd要素)
- [15-7] リストでナビゲーション( dl要素・dt要素・dd要素)
- [30] 定義語を示す<dfn>を、<abbr>や<dt>と一緒に使おう
D
- fieldset
- [48] フォーム部品のグループ化のための fieldset要素と legend要素
- figcaption
- [36] コンテンツをまとめる<figure>と、そのキャプション<figcaption>
- figure
- [36] コンテンツをまとめる<figure>と、そのキャプション<figcaption>
- filter
- [70-2] SVGフィルターを使ってみた
- footer
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-5] ヘッダーの header、フッターの footer、連絡先の address要素
- form
- [47] form要素で「送信先」と「送信方法」を指定しよう
- [59] フォームの属性 逆引き一覧 (どの属性がどの部品に使えるか)
- [60] フォームを美しく整えよう(CSS使用)
F
- h1〜h6
- [4] テキストに見出し(<h1>から<h6>)をつけてみよう
- [17-3] セクショニング要素と見出し要素のルール
- head
- [2] タイトル(title要素)を設定しよう
- header
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-5] ヘッダーの header、フッターの footer、連絡先の address要素
- hgroup
- *<hgroup>はHTML5の仕様から削除されました。
- hr
- [35] 内容の区切りを示す<hr>要素
- html
- [1] テキストエディタで書いてみよう
H
- i
- [23] <b><i><small>もまだ使えます
- iframe
- [63] インライン・フレームで 他のHTMLファイルを組み込もう <iframe>
- img
- [9-1] 画像を表示しよう
- [9-2] 画像にテキストを回り込ませよう(CSS使用)
- [10] 絶対URLと相対URL
- [11-5] 画像にリンクを貼ろう
- [14-2] GIFとJPEGの違い
- [71] img要素の srcset属性で画像を切り替えよう
- input
- [49-1] input要素の属性一覧 ・type属性の値一覧
- [49-2] input要素でテキストを入力してもらおう (text, search, tel, url, email, password)
- [49-3] input要素で ラジオボタン や チェックボックスを作ろう (radio, checkbox)
- [49-4] input要素で時間を入力してもらおう (datetime-local, date, month, week, time)
- [49-5] input要素で「数」を入力してもらおう (number)
- [49-6] input要素で「レンジ(割合)」を選んでもらおう (range)
- [49-7] input要素で「色」を選んでもらおう (color)
- [49-8] input要素でファイルを送ってもらおう (file)
- [49-9] input要素で非表示のデータを送ろう ( hidden )
- [49-10] input要素で送信ボタンやリセットボタンなどを作ろう (submit, reset, button)
- [49-10-2] input要素で作るボタン(submit, reset, button)の見た目を CSSで変えよう
- [49-11] input要素で画像の送信ボタンを作ろう (image)
- ins
- [24] 追加を示す<ins>と、削除されたことを示す<del>を使おう
I
- label
- [54] ラベルを付けて使いやすくしよう label要素
- legend
- [48] フォーム部品のグループ化のための fieldset要素と legend要素
- li
- [15-1] リストを作ろう( ul要素・li要素 )
- [15-2] 番号付きリストを作ろう( ol要素・li要素)
- [15-4] リストマーカーを画像や任意のテキストに変更する方法
- [15-5] リストでナビゲーション( li 要素を float で横に並べる)
- [15-6] リストでナビゲーション( li 要素を display で横に並べる)
- link
- [42-1] link要素で 外部CSSファイルの読み込み・グループ化をしよう
- [42-2] link要素の media属性で 外部CSSをメディア別に切り替えよう
- (ちょっとメモ)CSSの @import と @media(メディアクエリ)
- [42-3] link要素の「rel属性」の値(リンクタイプ)
- [42-4] link要素で ショートカットアイコン(favicon)を表示させよう
L
- main
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-6] メインコンテンツを表す main要素
- map
- [61] イメージマップ(リンク領域)を作ろう map要素・area要素
- mark
- [22] HTML5の新要素<mark>を使ってみよう( <strong><em>との使い分け)
- meta
- [45-1] meta要素で基本情報(メタデータ)を指定しよう
- [45-2] meta要素の charset属性で文字コードを指定しよう
- [45-3] meta要素の name属性でサイトの情報を指定しよう
- [45-4] meta要素の http-equiv属性で動作を指示しよう
- [45-5] meta要素で OGPを設定しよう
- meter
- [56] 数量や割合のゲージを表示しよう meter要素
M
- nav
- [17-4] ナビゲーションのセクションを表す nav要素
- [17-3] セクショニング要素と見出し要素のルール
- [15-5] リストでナビゲーション( li 要素を float で横に並べる)
N
- object
- [62] 外部コンテンツを組み込もう <object> <param>
- ol
- [15-2] 番号付きリストを作ろう( ol要素・li要素)
- optgroup
- [51] セレクトメニューを作ろう(select・option・optgroup要素)
- option
- [51] セレクトメニューを作ろう(select・option・optgroup要素)
- output
- [55] 計算結果の出力欄を作ろう output要素
O
- p
- [6] 段落に <p>要素を使おう(ついでにCSSで整えてみよう)
- param
- [62] 外部コンテンツを組み込もう <object> <param>
- picture
- [72] デバイスに合わせた画像を表示できる picture要素
- pre
- [31-1] <code> と <pre> でソースを表示しよう
- [31-2] <pre>要素と同じ効果のCSS「white-space : pre」
- progress
- [57] プログレスバー(進捗状況)を出そう progress要素
P
- q
- [27] <q>で引用文を示そう
Q
- ruby
- [19] テキストにルビをつけてみよう(ruby, rt, rb, rp, rtc)
- rb
- [19] テキストにルビをつけてみよう(ruby, rt, rb, rp, rtc)
- rp
- [19] テキストにルビをつけてみよう(ruby, rt, rb, rp, rtc)
- rt
- [19] テキストにルビをつけてみよう(ruby, rt, rb, rp, rtc)
- rtc
- [19] テキストにルビをつけてみよう(ruby, rt, rb, rp, rtc)
R
- s
- (ちょっとメモ)u要素と s要素は復活(HTML5で廃止ではありません)
- samp
- [32] その他のプログラム関連を示す samp、kbd、var、data要素
- script
- [44] script要素で HTMLにスクリプトを読み込む or 直接書く
- section
- [17-1] HTML5 の新要素でページ全体を組もう
- [17-2] セクショニングの article要素、aside要素、section要素
- [17-3] セクショニング要素と見出し要素のルール
- select
- [51] セレクトメニューを作ろう(select・option・optgroup要素)
- small
- [23] <b><i><small>もまだ使えます
- source
- [65] 動画をプラグイン無しで組み込もう <video> <source>
- [66] 音声をプラグイン無しで組み込もう <audio><source>
- span
- [7] <div>や<span>で特定の範囲を指定しよう
- strong
- [21] 重要度を示す<strong>と強調を示す<em>を使い分けよう
- style
- [43] style要素で CSS を HTML文書内に書こう
- sub
- [20] 上付き文字と下付き文字を使おう(sup, sub)
- sup
- [20] 上付き文字と下付き文字を使おう(sup, sub)
- svg
- [70-1] svg要素でベクターグラフィクスを埋め込もう
- [70-2] SVGフィルターを使ってみた
- [70-3] CSSだけで作る SVGのドローイングアニメーション
- [70-4] JavaScriptライブラリで作るSVGモーフィングアニメーション
- [70-5] 複数のSVGを1つにまとめて個別に呼び出す SVGスプライト
S
- table
- [16-1] table(表)を作ろう(まずは基本の table, tr, th, td)
- (ちょっとメモ)テーブルをレスポンシブ対応させるCSS
- tbody
- [16-5] table横列グループ化(thead, tbody, tfoot)
- td
- [16-1] table(表)を作ろう(まずは基本の table, tr, th, td)
- [16-7] テーブルセルで使う scope属性と headers属性について
- template
- [46] template要素でテンプレートを作ろう
- textarea
- [53] 文章 (複数行のテキスト) を入力してもらおう textarea要素
- tfoot
- [16-5] table横列グループ化(thead, tbody, tfoot)
- th
- [16-1] table(表)を作ろう(まずは基本の table, tr, th, td)
- [16-7] テーブルセルで使う scope属性と headers属性について
- thead
- [16-5] table横列グループ化(thead, tbody, tfoot)
- time
- [25] 新しい要素<time>で正確な日時を記述しよう
- title
- [2] タイトル(title要素)を設定しよう
- tr
- [16-1] table(表)を作ろう(まずは基本の table, tr, th, td)
- track
- [68] 動画や音声に字幕やキャプションを表示しよう <track>
T
- u
- (ちょっとメモ)u要素と s要素は復活(HTML5で廃止ではありません)
- ul
- [15-1] リストを作ろう( ul要素・li要素 )
- [15-4] リストマーカーを画像や任意のテキストに変更する方法
- [15-5] リストでナビゲーション( li 要素を float で横に並べる)
- [15-6] リストでナビゲーション( li 要素を display で横に並べる)
U
- var
- [32] その他のプログラム関連を示す samp、kbd、var、data要素
- video
- [65] 動画をプラグイン無しで組み込もう <video> <source>
- [67]「mediagroup属性」でメディア要素を同期させよう
V
- HTML要素以外
- [3] !DOCTYPE宣言をしよう
- lang="ja" →HTML文書の言語コード( [3] !DOCTYPE宣言をしよう)
- meta charset=" " →HTML文書の文字エンコーディング( [3] !DOCTYPE宣言をしよう)
- [8]コメントを入れよう( <!-- --> HTMLのコメント )
- [10] 絶対URL と 相対URL
- [12-1] CSSを外部ファイルにしよう
- [12-2] なんでHTMLとCSSはセットなの?(ウェブのアクセシビリティ)
- [14-2] 画像形式について(GIF、JPEG、PNG の違い)
- [14-3] データの容量を示す単位(バイト、キロバイト、メガバイト)
- [14-4] 色指定について(16進数, 色名, 10進数, HSL, accessibility)
- [37] HTML5要素の「カテゴリー」を見てみよう(「カテゴリー」と属する要素一覧)
- [38-1] 「コンテンツ・モデル」で要素のルールを見てみよう
- [38-2] 「コンテンツ・モデル」一覧
- [39] 全要素に使える「HTML5グローバル属性」を見てみよう
- target属性(「[41] base でベースの URL を示そう」の後半)
- 正規表記 → pattern属性でマッチング( [49-1] input要素でいろんな部品を作ろう)
- フォームの属性 逆引き一覧 →( [59] どの属性がどのフォーム部品に使えるか)
- [60] フォームを美しく整えよう(CSS使用)
- ちょっとメモ・余談
- index.html という名のファイル(デフォルトドキュメント)
- HTML5で廃止される要素一覧
- CSS の ベンダープレフィックス について
- HTML5の文法チェックサイト
- MIMEタイプ
- <link>よりスマートな CSSの @import と @media
- 文字コード, 文字集合, エンコードについて(1)2進法、ビットとバイト、JIS
- 文字コード, 文字集合, エンコードについて(2)Shift_JIS、Unicode、UTF-8
- 整理しよう。フォームのプッシュボタン比較( <input> <button> )
- HTML5 での 省略可能なタグについて
- 属性の「引用符」や「値」の省略について
- canvasで便利な javaScriptライブラリ
- StatCounter でブラウザのシェアを調べる
- API って何だ?(HTML5 の API について)
- (ちょっとメモ)FC2ブログで OGP設定(Facebook, Twitter Cardsも)
- Prism の使い方
その他
- 関連記事
-
- はじめに
- はじめてのCSS INDEX
- HTML要素 索引
- PROFILE
- INDEX
初心者にも使いやすい(と思う)レンタルサーバー
「初心者ですがレンタルサーバーはどこがいい?」というご質問をよくいただきます。
自由にファイルをアップロードできる自分のサーバがあると便利ですよね。ローカル環境じゃなくサーバ上で試してみたい時がありますからね。
私が使っているのは、
スターサーバーや ロリポップ!
です。どちらも管理画面がわかりやすく、マニュアルも充実していて、料金も安い。どちらもライトプラン以上で WordPress が使えます。
初心者が始めやすいサーバだと思います。
ちょっと料金は高いけど、さくらのレンタルサーバや、エックスサーバー
は、やはり老舗なのでおすすめです。
両方とも高スペックでコスパが良く、老舗でユーザーが多いので、質問する場がたくさんあります。初心者だけど仕事でサーバが欲しい場合は、安心なのではないかと思います。
スポンサーリンク