[107] HTML の align 属性は、 揃えの方法を指定するものでした。

仕様書

文章系ブロック水準要素 align 属性 (HTML, XHTML 1)

[46] HTML のブロック水準要素の多くには、 (現在では非推奨の) align 属性が定義されています。

文章を直接内容に持つ系統の要素の align 属性は、文章の揃え位置を指定します。

[47] 適用対象要素型:

[48] 仕様書:

代替

[51] この属性は非推奨です HTML 4。 スタイル・シートを使うことが良いとされています。

[52] CSS の場合、 text-align 特性が使えます。

属性値

[49] この属性は列挙型です。

属性値説明出典
left左揃え[HTML 4]
center中央揃え[HTML 4]
right右揃え[HTML 4]
justify両端揃え[HTML 4]

[81] この属性は省略可能です。 省略時の既定値は基底文方向依存で、左から右なら left, 右から左なら right です (DTD 的には既定値なしです) HTML 4 15.1.2, SI 4281:1998 9.1。

[82] justify の場合、 最後の行の位置は要素の基底方向性によります SI 4281:1998 9.1。

例

[50] 見出しを画布キャンバスの中央に寄せる HTML 4 15.1.2

<H1 align="center"> How to Carve Wood </H1>

align 属性は非推奨で、スタイル・シートを使うことが推奨されています。 CSS では h1 { text-align: center} と指定して同じ効果が得られます。

[37] 段落を画布の右で揃える例 HTML 4 15.1.2、改

<P class="mypar" align="right">...Lots of paragraph text...

align 属性は非推奨で、スタイル・シートを使うことが推奨されています。 CSS では p.mypar {text-align: center} と指定して同じ効果が得られます。

[53] 段落列を div でまとめ、 右端で文字を揃える例 HTML 4 15.1.2

<DIV align="right">
 <P>...text in first paragraph...
 <P>...text in second paragraph...
 <P>...text in third paragraph...
</DIV>

align 属性は非推奨で、スタイル・シートを使うことが推奨されています。 CSS では div {text-align: center} と指定して同じ効果が得られます (CSS では div 要素への指定が子要素である p に継承されます)。

他との関係

[54] 非推奨の center 要素は、 div 要素で align 属性を center と指定したものと等価です HTML 4。

[63] iframe 要素や input 要素の align 属性の定義は HTML 4 仕様書 HTML 4 16.5, 17.4 ではこの種の align を指していますが、 意味と DTD の記述から考えると、 >>38 と同じ種類とするのが正しいと考えられます。

メモ

[93] XHTML m12n の抽象モジュール定義は 1.0 から 2007年の 1.1 WD までずっと typo があります。誰も気づかないということはないと思うのですが。。。 (名無しさん)

table 要素 align 属性 (HTML, XHTML 1)

[9] HTML の table 要素の align 属性は、文書に対する表の位置を指定します。

[10] 仕様書:

[77]

(名無しさん [sage])

[78] HTML 4 DTD の注釈 (参考) には table position relative to window と書かれています。 (名無しさん [sage])

スタイル・シート代替

[13] この属性は HTML 4 で非推奨とされています。 代わりにスタイル・シートで指定できます。

[14] たとえば、 CSS では table {margin-left: auto; margin-right: auto} と指定すれば center を実現できます。

属性値

[11] この属性は列挙型です。

属性値説明出典
bleedleft“bleed” over (余白を超えて) 左浮き[WEBTV]
bleedright“bleed” over 右浮き[WEBTV]
center中央寄せ[HTML 4], [WEBTV]
left左寄せ[HTML 4], [WEBTV]
right右寄せ[HTML 4], [WEBTV]

[12] HTML 4 仕様書には既定値は書かれていません。 [WEBTV] では、既定値は left です。

[20] 仕様上の SGML宣言の如何にかかわらず、ほとんどの WWWブラウザは属性名の省略に対応していません。

[22] この属性は省略可能です。

他との関係

[33] この属性は表のこまの align 属性に影響し得ます。 詳しくは %cellhalign の説明をみてください。

メモ

表構成要素系要素 align 属性 (HTML, XHTML 1)

[15] HTML の要素型 tbody, thead, tfoot, colgroup, col, tr, th, td で定義されている align 属性は、 こま内のデータの揃え位置を指定します。

[73] 仕様書:

スタイル・シート代替

[16] この属性は HTML 4 では非推奨とされていませんが、 スタイル・シートで指定する方が望ましいと考えられます。

[17] たとえば、 CSS では text-align 特性で (属性値もほとんどそのまま) 指定できます。

属性値

[19] この属性は列挙型です。

left
左流しデータ、左揃え文。
center
中央データ、中央揃え文。
right
右流しデータ、右揃え文。
justify
両端揃え文。
char
特定の文字で文を揃える。 UA 未対応時の振舞いは未規定 HTML 4.01 11.3.2, A.1.1.7。

[21] ほとんどの WWWブラウザは属性名の省略に対応していません。

[23] この属性は省略可能です。 DTD 上の既定値はありません。

HTML 4 仕様書本文によれば、データこまでは left, 見出しこまでは center が既定値です。 とかいいながら別の節に継承規則があって、それでも得られないときの既定値は UA 依存です。ともかく継承規則については %cellhalign の説明をみてください。

[34] その継承規則のところでは、どこにも陽に指定がないときの最終決定は UA 依存の値によるとされていますが、単に常に left というような既定値ではなく、現在文方向によって決めろと書いてあります。 言っていることがばらばらですねぇ。 もちろん、 >>23 は間違いで >>34 が意図だとは思います。

[35] また、 justify に対応していない UA は現在文方向を使って決めるべきだとの指示もあります (対応しなくても良いとはどこにも書いてない気がしますが)。

他との関係

[18] HTML 4 の DTD では、この属性は属性集合 %cellhalign の一員です。

[31] char の時の揃え文字は char 属性で指定します。 こま内の揃える実際の位置は charoff 属性で指定します。

実装

[36] ほとんどの視覚 WWW ブラウザは left と center と right、 せいぜい justify にしか対応していません。

メモ

caption 要素・legend 要素 align 属性 (HTML, XHTML 1)

[24] HTML の caption 要素や fieldset 要素の align 属性は、題名を表や欄集合に対してどの位置に置くかを指定します。

仕様書:

[79]

(名無しさん [sage])

スタイル・シート代替

[25] この属性は非推奨です HTML 4。 代わりにスタイル・シートで指定するべきです。

[26] CSS では、 caption-side 特性があります。表ではこの特性が align 属性の代わりに使えます。

属性値

[27] この属性は列挙型です。

属性値説明出典 (caption)出典 (legend)
bottom下[HTML 3.2], [HTML4], [XHTML1], [WebTV][HTML 4]
center上に中央寄せ[WebTV]
left左[HTML4], [XHTML1][HTML 4]
left左側にあわせる[WebTV]
right右[HTML4], [XHTML1][HTML 4]
right右側にあわせる[WebTV]
top上[HTML 3.2], [HTML4], [XHTML1], [WebTV][HTML 4]

WebTV は HTML 4 と違う意味で使っているようです WebTV。

[29] この属性値は省略可能です。 HTML 4 の DTD 上は既定値はありません。 HTML 4 仕様書本文によれば、 top が既定値です HTML 4 caption, 17.10。 WebTV では、 center が既定値です WebTV。

[75] HTML 4 DTD の注釈 (参考) には legend 要素では relative to fieldset と説明があります。

(名無しさん [sage])

[76] HTML 4 DTD では legend 要素の align 属性の型は %LAlign です。 (定義は caption 要素のものと同じです。)

(名無しさん [sage])

[80] HTML 4 DTD の注釈 (参考) には caption 要素では relative to table と説明があります。

実装

[28] ほとんどの WWWブラウザは属性名の省略に対応していません。

[30] 多くの WWW ブラウザは、 left や right に対応していません。

[95] >>30 Firefox 3 は対応しているみたいですね。知りませんでした。

HTML5

[96] legend 要素の align は現実には left、center、right のいずれかで、fieldset 要素の上境界辺上での表示揃え位置を指定するもののようです。 Web Applications 1.0

メモ

[94] 機械振興会館 (2008-07-29 20:46:12 +09:00 版) http://www.jspmi.or.jp/kaikanleft.htm

<TABLE width="120">
  <CAPTION align="left"><B>機械振興会館</B></CAPTION>
  <TBODY>

(名無しさん)

*-align (CSS)

[83] 111 (名無しさん 2007-02-24 14:50:51 +00:00)

object 要素・img 要素・applet 要素・embed 要素・input 要素・iframe 要素 align 属性 (HTML, XHTML 1)

[38] HTML の object 要素、 img 要素、 applet 要素、 embed 要素、 input 要素 (type が image)、 iframe 要素 の align 属性は、各要素の文脈に対する表示位置を指定します。

[39] 仕様書:

代替

[40] この属性は HTML 4 で非推奨とされています。 代わりにスタイル・シートを使うことが好ましいといわれています。

[41] CSS では text-align 特性や vertical-align 特性や margin 系特性群などで同様の効果が得られます。

属性値

[42] この属性は列挙型です。

指定できるのは次の値です。
属性値説明出典 (object)出典 (img)出典 (applet)出典 (embed)出典 (input)出典 (iframe)
baseline[WebTV]
bottom物体の下と基線を揃える[HTML 4][HTML 4], [WebTV][HTML 4][WebTV][HTML 4] DTD, [WebTV][HTML 4] DTD, [WebTV]
center物体の中央と基線を揃える[WebTV][WebTV]
center中央揃え[HTML 4] 本文[HTML 4] 本文
justify両端揃え[HTML 4] 本文[HTML 4] 本文
left左余白に浮動[HTML 4], [WebTV][HTML 4], [WebTV][HTML 4][WebTV][HTML 4] DTD, [WebTV][HTML 4] DTD
left左揃え[HTML 4] 本文[HTML 4] 本文
middle物体の垂直中央と基線を揃える[HTML 4], [WebTV][HTML 4], [WebTV][HTML 4][WebTV][HTML 4] DTD[HTML 4] DTD
right右余白に浮動[HTML 4], [WebTV][HTML 4], [WebTV][HTML 4][WebTV][HTML 4] DTD, [WebTV][HTML 4] DTD
left右揃え[HTML 4] 本文[HTML 4] 本文
textbottom[WebTV]
textmiddle[WebTV]
texttop[WebTV]
top物体の上と行の上を揃える[HTML 4][HTML 4], [WebTV][HTML 4][WebTV][HTML 4] DTD, [WebTV][HTML 4] DTD, [WebTV]

[43] この属性は省略可能です。

省略時の既定値は bottom です HTML 4。 ただし [WebTV] では img と input では top, object と embed では left とされています。

[74] HTML 4 DTD 注釈には center? と書かれています。 確かに left と right があれば center も、と思うのは自然なところ。

レンダリング

[44] UA は align 値を様々に解釈しています。 当該要素以前の文字列に対して揃えるものもあれば、 以後の文字列も考慮するものもあります。 HTML 4

どちらが正しいと決められてはいないようです。

歴史

[86] HTML 2.0 は img 要素を標準化しました。 align 属性もこのとき定義されていましたが、 属性値は top, middle, bottom の3種類だけでした。

[84] Netscape Navigator は HTML 2.0 の拡張として6種類の属性値を追加実装しています (>>87-88)。

Netscape Navigator Extensions to HTML http://web.archive.org/web/20000415023954/http://www.netscape.com/home/services_docs/html-extensions.html

[87] left と right は、浮動を表す属性値として追加されました。

[88] その他の値は 私が最初に img を実装した時のひどい間違いを正そうとして 追加されました。私 というのは Marc Andreessen でしょうか。 後方互換性のため、既存の属性値の意味は変更せず、 新たな属性値を追加したと説明されています。

実装

[45] ほとんどの WWWブラウザは属性名の省略に対応していません。

メモ

[64] iframe 要素や input 要素の align 属性は、 HTML 4 仕様書 HTML 4 16.5, 17.4 では >>46 の種類の align 属性だとされています。 しかし、意味と DTD の記述を考慮すれば、 object と同じ種類と考えるのが正しいはずです。 (しかし正誤票でも修正されていません。誰も気付いていないのでしょうか?)

[65] input 要素の場合、 type が image の場合のみ適用されるのか、他の場合にも適用されるのかはわかりません。 (HTML 4 仕様書にはまったく記述がありません。)

[90] >>64 属性索引は iframe や input の align をこの種類にしています。 (名無しさん)

[91] XHTML m12n 1.0 勧告の抽象モジュール定義では img の align が >>46 型になっていますが、 XHTML m12n 1.1 では修正されています。 (名無しさん)

[92] XHTML m12n 1.0〜1.1 の抽象モジュール定義では input の align は HTML 4 の img のものと同じ型になっています。 注釈として基本フォームモジュールとフォームモジュールが選択されていれば、とあります。 input type image が定義されていない基本フォームモジュールでも align が使えることに意味はあるのでしょうか。 (名無しさん)

浮動 (HTML)

[55] HTML の表、物体、画像、枠などの align 属性を left や right と指定すると、 その物体は左右の余白に浮動floatします HTML 4 15.1.3.1。

浮動物体は普通新しい行を始めます HTML 4 15.1.3.1。

[56] 仕様書:

代替

[60] align 属性は非推奨です HTML 4。 代わりにスタイル・シートで指定できます。

[61] CSS では float 特性で指定できます。

属性値

[58] align 属性値:

left
左余白に物体を浮動させます。続きの文章は右側に流します。
right
右余白に物体を浮動させます。続きの文章は左側に流します。

[59] なお、 center は要素型によっては物体を画布キャンバスの中央に寄せますが、 浮動してはいません。 (また、 p などの center は中身の文章を中央寄せします。)

例

[57]

<IMG align="left" src="http://foo.com/animage.gif" alt="my boat">

メモ

[62] 浮動による文章の回り込みを解除するには、 br 要素の clear 属性 (非推奨) を使います。 非推奨属性の代わりに、 CSS の clear 特性などを使うこともできます。

hr 要素 align 属性

[66] HTML の hr 要素の align 属性は、 水平線を左右余白間の領域の左右中央どこに配置するかを指定します。

[67] 仕様書:

代替

[68] この属性は非推奨です HTML 4。 代わりに、スタイル・シートで指定できます。

属性値

[69] この属性は列挙型です。
属性値説明出典
left左揃え[HTML 3.2], [HTML 4]
center中央寄せ[HTML 3.2], [HTML 4]
right右揃え[HTML 3.2], [HTML 4]

[70] この属性は省略可能です。省略時の既定値は center です (DTD 的には #IMPLIED です) HTML 3.2, HTML 4。 (他の要素型の align 属性とは異なるので注意してください。)

歴史

[85] hr 要素の align 属性は HTML 2.0 の拡張として Netscape Navigator が実装しました。

同時に追加された width 属性により水平線が文書の表示幅に満たない場合も考えられるようになったため、 水平線の位置を left、 center、right から選べるようにしたと説明があります。

Netscape Navigator Extensions to HTML http://web.archive.org/web/20000415023954/http://www.netscape.com/home/services_docs/html-extensions.html

[71] HTML 2.x ではブロック的要素の一種として >>46 の align 属性が追加されました。 強制空要素である hr にこの意味の align 属性を追加したのは誤りであったと考えられます。 (justify と指定したらどうなるのだか。)

[72] HTML 3.2 および HTML 4 では、実際に使用・実装されている意味での align 属性が規定されています。

IDL 属性

[32] HTMLParagraphElement インターフェイスの 廃止状態のIDL属性 align は、 align 内容属性を反映しなければなりません >>5。文字列として反映します。

[4] HTMLEmbedElement インターフェイスの 廃止状態のIDL属性 align は、 align 内容属性を反映しなければなりません >>3。文字列として反映します。

メモ

[8] >>7 の情報によると、

[89] アイドルお宝画像ブログ: ほしのあき画像特集 (2007-02-17 12:44:29 +09:00 版) http://idolblog.sblo.jp/article/635852.html

<div class="text"><strong>ほしのあき画像特集</strong><br /><a href="http://www.amazon.co.jp/exec/obidos/ASIN/B0001W8HPW/zeroenkarages-22/ref=nosim/" name="amazletlink" target="_blank"><img src="http://images-jp.amazon.com/images/P/B0001W8HPW.09.MZZZZZZZ.jpg" alt="ほしのあき Darn-Tarn" style="border: none;" / align=left></a>ほしのあき<br />生年月日1978.3.14<br />血液型O型<br />出身地 東京<br />サイズT165 B88 W56 H87 S23.5<br />趣味・特技<br />マッサージ通い お散歩 種無しブドウを喉ににつめて戻す。最高10粒。<br /><a href="http://im.adonavi.jp/RD/pt/11462/in/3151.html">騙しリンク無し!完全無料画像掲示板</a></align></align><br /><br />

これはなに? (名無しさん)

[97] Web Applications 1.0 r5895 Remove pointless rules. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=5894&to=5895

[98] Web Applications 1.0 r6919 Drop support for obsolete table alignment values that no browser supports any more anyway.Fixing https://www.w3.org/Bugs/Public/show_bug.cgi?id=9442 ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6918&to=6919

[99] CSS Box Alignment Module Level 3 ( ( 版)) http://dev.w3.org/csswg/css3-align/#overview

[100] Re: [css3-flexbox] [css3-grid-layout] Too Many Alignment Properties ( (fantasai 著, 版)) http://lists.w3.org/Archives/Public/www-style/2012Feb/0743.html

[101] Web Applications 1.0 r7424 Add left and right caption alignment options. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7423&to=7424

[102] IRC logs: freenode / #whatwg / 20130116 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130116#l-342

[103] CSS Box Alignment Module Level 3 ( ( 版)) http://www.w3.org/TR/2013/WD-css3-align-20130514/

[104] 915 – (col-align-inherit) implement inheritance of alignment attributes from columns (align, valign, char, charoff, (lang, dir)?) ( ( 版)) https://bugzilla.mozilla.org/show_bug.cgi?id=915

[105] ncsa-mosaic/CHANGES at master · alandipert/ncsa-mosaic ( ( 版)) https://github.com/alandipert/ncsa-mosaic/blob/master/CHANGES#L619

[106] Remove <applet> (zcorpan著, ) https://github.com/whatwg/html/commit/b9b9d60f9451c05f8e8d542e4094f987ae1a5fb8