|
HTML HTML5 HTMLタグ スマートフォン |
CSS CSSプロパティ CSS・HTML便利ツール |
HTML色見本 配色組み合わせツール 特殊文字 |
JAVA Android |
PHP Smarty修飾子 EXCEL |
WEB技術の辞書・解説・使用例
font-stretch
フォントの幅を広く・狭くする
CSS2.1で一度廃止されました。
幅狭の形状にするには「～condensed」を指定。
幅広の形状にするには「～expanded」を指定。
ultra-condensed …normalより4段階幅狭。
extra-condensed …normalより3段階幅狭。
condensed …normalより2段階幅狭。
semi-condensed …normalより1段階幅狭。
semi-expanded …normalより1段階幅広。
expanded …normalより2段階幅広。
extra-expanded …normalより3段階幅広。
ultra-expanded …normalより4段階幅広。
normal …標準（初期値）。
narrower …1段階幅狭。
wider …1段階幅広。
幅広の形状にするには「～expanded」を指定。
狭くするパラメーター
ultra-condensed …normalより4段階幅狭。extra-condensed …normalより3段階幅狭。condensed …normalより2段階幅狭。semi-condensed …normalより1段階幅狭。広くするパラメーター
semi-expanded …normalより1段階幅広。expanded …normalより2段階幅広。extra-expanded …normalより3段階幅広。ultra-expanded …normalより4段階幅広。その他のパラメーター
normal …標準（初期値）。narrower …1段階幅狭。wider …1段階幅広。
サンプルコード（狭く）
<p style="font-stretch:ultra-condensed;">font-stretch:ultra-condensed;</p><p style="font-stretch:extra-condensed;">font-stretch:extra-condensed;</p>
<p style="font-stretch:condensed;">font-stretch:condensed;</p>
<p style="font-stretch:semi-condensed;">font-stretch:semi-condensed;</p>
font-stretch:ultra-condensed;
font-stretch:extra-condensed;
font-stretch:condensed;
font-stretch:semi-condensed;
サンプルコード（広く）
<p style="font-stretch:semi-expanded;">font-stretch:semi-expanded;</p><p style="font-stretch:expanded;">font-stretch:expanded;</p>
<p style="font-stretch:extra-expanded;">font-stretch:extra-expanded;</p>
<p style="font-stretch:ultra-expanded;">font-stretch:ultra-expanded;</p>
font-stretch:semi-expanded;
font-stretch:expanded;
font-stretch:extra-expanded;
font-stretch:ultra-expanded;