HyperText Markup Language

出典: 謎の百科事典もどき『エンペディア（Enpedia）』
ナビゲーションに移動 検索に移動

HyperText Markup Language（ハイパーテキストマークアップランゲージ、略称：HTML（エイチティーエムエル））とは、Webページの文書構造を記述するためのマークアップ言語のことである。

概要[編集]

文章中での意味を付加する要素の多くは開始タグ（<要素名>）と終了タグ（</要素名>）の形で構成される。
仕様は一様ではなくHTML5+CSS2が主流である現今の仕様とXHTMLなどの旧規格では、異なる場合があり、サニタイザや変換エンジン、あるいはユーザ環境であるブラウザがどの程度サポートしているかによって画面表示がまちまちだったりする。
たとえば、「挟む要素がない場合は、開始タグと終了タグを一体化した短縮形が利用できる（<要素名 />）」というルールにおいて、「『br」や『hr』をどう書くか？」については「スタイルによる」としか言えない。
このあたりの問題は、充分に議論を重ねたうえで解決すべき問題だが、なかなか足並みが揃わないのが悩ましい。

要素の例[編集]

文字要素[編集]

  • & - &amp; と表記する。「アンパサンド」である。
  • < - &lt; と表記する。
  • > - &gt; と表記する。

<head>[編集]

主にページタイトルなどといったメインコンテンツに含まれない要素を記述する。主に使うのは次の要素。

<title>

ページタイトルを指定する要素。

<style>

ページ内にCSSを直接記述するのに使用する要素。

<script>

ページ内にJavaScriptを直接記述するのに使用する要素。

<link>

後述するaタグとは別であり、主に外部CSS、JSを呼び出すのに使われる。例えば、CSSの場合、

<link rel="stylesheet" href="ファイル名.css">

とする。

<div>[編集]

divitionの略称。囲まれた箇所をひとかたまりとして扱う。

<span>[編集]

他のコンテンツの右横に並ぼうと振る舞うインライン要素。

<table>[編集]

caption（表の題名）、tr（表の横一列）、td（データセル）、th（見出しのセル）などの要素を内部で組み合わせて表を作成する。 

<table>
    <caption>交通事故告知表</caption>
    <tr>
        <th>\</th><th>件数</th><th>死亡</th>
    </tr>
    <tr>
        <th>昨年</th><td>32492件</td><td>116人</td>
    </tr>
    <tr>
        <th>昨日</th><td>8件</td><td>0人</td>
    </tr>
</table>

<a>[編集]

aはanchor（アンカー）の略。下記のようにhref属性にURLを当てはめると、クリック時にそのURL先にページが遷移するハイパーリンクとして機能する。 

<a href="https://enpedia.rxy.jp/wiki/HyperText_Markup_Language">HyperText Markup Language</a>

<pre>[編集]

各種ソースコードを貼りつけるときに使う。

<input>[編集]

type属性に指定された値によって、テキスト欄やレンジバー・チェックボックスなど様々なUIとして振る舞う。終了タグは必要ない。 

<input type="text"><!--1行のテキスト欄-->

<button>[編集]

ボタンを生成する。

<textarea>[編集]

複数行入力できるテキスト欄を生成する。

<h1> <h2> <h3> <h4> <h5> <h6>[編集]

見出し。内部のテキストのサイズが大きくなり、線が太く表示される。hの横に続く数が大きいほど小さな見出しとなる。

<script>[編集]

ページ読み込み時に、内部に直接書かれたJavaScriptコードや、src属性のリンク先にあるJavaScriptファイルを実行する。上から順次実行される。 

<script>
alert("Hello, world!");//ページ読み込み時に「Hello, world!」と書かれたアラートがポップアップされる。
</script>

<!--false-->
<script>alert(typeof jQuery != "undefined");</script>

<!--これ以下のscript要素内ではjQueryライブラリが使用できる-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!--true-->
<script>alert(typeof jQuery != "undefined");</script>

<style>[編集]

内部に直接書かれたCSSコードをページに反映させる。 

<style>
body{
    background: "tomato"/*背景がトマト色になる*/
}
</style>

<img>[編集]

ページに画像を埋め込む。

<audio> <video>[編集]

ページに音声や動画を埋め込む。sourseタグを使用すると、複数コンテンツのうちWebブラウザが対応しているフォーマットの一つを自動的に選択させることができる。

この節は執筆の途中です この節はまだ執筆途中です。加筆、訂正して下さる協力者を募集中!

廃止された主な要素[編集]

HTML5にて、スタイル装飾の役割がCSSに限定された煽りで廃止された要素が多い。

<font>[編集]

color属性やsize属性などで文字のスタイルを指定する。HTML4で非推奨要素となり、HTML5で廃止された[1]。

<center>[編集]

インラインコンテンツを中央揃えする。HTML4で非推奨となり、廃止された[2]。

<marquee>[編集]

詳細は「marqueeタグ」を参照

マーキーと読む。文字を自動でスクロール描画する要素。Internet Explorerが独自実装したのを契機に広まり、かつてはページを動的に見せる貴重な手段として人気を誇ったが、HTML5で廃止された[3]。一部の間でCSSでの代替が試みられている。 

<marquee>自動でスクロールする文字</marquee>

Wiki記法によるテキスト上でのHTMLの扱い[編集]

この節は執筆の途中です この節はまだ執筆途中です。加筆、訂正して下さる協力者を募集中!

MediaWikiは機能拡張が行えるため、「MediaWiki本来の機能」以外にも「拡張された部分」があり、「MediaWiki本来の機能」を改変することも可能なようである。「MediaWiki本来の機能」に含まれる独自の記法には、<ref>や<nowiki>など、HTMLタグ類似の記法も存在する。他にもHTMLタグを使用することもできるが、<a>や<img>などは使用できない[4]。
したがって、「ウィキペディアで使用できるもの全てが使える訳ではない」が、「エンペディア独自に使用可能なものもある」かもりれない[5]。

<chem>[編集]

化学反応式に使える。例えば<chem>2H2 + O2 -> 2H2O</chem>と書くと以下の出力になる。

とはいえ <sub>を使って 2H2 + O2 → 2H2Oとする流儀もあるが、けっこう面倒臭いため「ウィキの精神からすると、いかがなものか？」という議論はある。

<math>[編集]

数式に使える。とはいえ凝った数式を書く人も少ないので、ユーザの利便性との兼ねあいある。普通はX^2+Y^2=Z^2は、 <sup>を使って X2+Y2=Z2くらいで済む。

脚注[編集]

  1. ↑ <font> -MDN
  2. ↑ <center>: 文字列の中央揃え要素 (廃止) - MDN
  3. ↑ <marquee>: マーキー要素 (廃止) - MDN
  4. ↑ 内部リンクなら[[ページ名]]、外部リンクなら[url 説明]、画像はアップロードしてから[[ファイル:Enpedia_Logo.png|thumb|画像説明]]みたいにするのがセオリーだとEnpediaではされているらしい。このあたりはサンドボックス内でいろいろと試みるしかない。
  5. ↑ jawp:Help:ウィキテキストにおけるHTML

関連項目[編集]

外部リンク[編集]


「https://enpedia.rxy.jp/w/index.php?title=HyperText_Markup_Language&oldid=867886」から取得