<html xmlns="http://www.w3.org/1999/xhtml"><head></head><body><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="2" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[2]</anchor-end> 
<dfn><code>unit-number</code></dfn>
は<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">単位</anchor>付きの<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">数値</anchor>を表す <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">HTML<title xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:10:">HTML要素</title></anchor> <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">カスタム要素</anchor>です。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="1" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[1]</anchor-end> <cite xml:lang="en">wakaba/html-unit-number</cite>
(<time>2018-12-01 17:33:16 +09:00</time>)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="https://github.com/wakaba/html-unit-number">https://github.com/wakaba/html-unit-number</anchor-external></p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="3" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[3]</anchor-end> 
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">数値</anchor>、<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">単位</anchor>、その全体をそれぞれ<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">要素</anchor>として表します。
それぞれの色や大きさ、<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">フォント</anchor>、間の<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">アキ</anchor>の大きさなどは
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CSS</anchor> で制御できます。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="4" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[4]</anchor-end> 
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">JavaScript</anchor> で<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">数値型</anchor>の値を設定して、
自動的に数値と単位を設定させることができます。
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">km</anchor> と <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">m</anchor> のように、適切な大きさの<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">単位</anchor>を自動選択させられます。
(表示用の単位付きの値の整形を<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">アプリケーションロジック</anchor>から分離できます。)</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="5" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[5]</anchor-end> 
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">長さ</anchor>、<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">高さ</anchor>は<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">メートル法</anchor> (<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">m</anchor>, <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">km</anchor>) と<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">ヤードポンド法</anchor>
(<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">フィート</anchor>, <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">マイル</anchor>) のどちらかを選べます。
自動的に換算するので、<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">アプリケーション</anchor>は<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">メートル法</anchor>だけで実装できます。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="6" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[6]</anchor-end> <code>html-page-components</code> の <code>$fill</code> とも組み合わせて使えます。</p></body></html>