CSS3

プロパティ

outline-width

→●、mdn

外形線の太さ。

上に示された各種 外形線プロパティにより作成される外形線は、ボックスの“上から”描かれる ― すなわち外形線は、常に手前にあり、ボックスや他のボックスの位置やサイズには波及しない。従って、外形線の表示の有無が変わっても、リフローが生じることはない。

外形線は：

• 矩形でなくてもよい。例えば、要素がいくつかの行たちに分断されている場合、それらの各ボックスを囲うような、最小本数の外形線からなるべきである。
• その各部分は、（改行されるときの、行内 要素のボーダーのように）線が途切れることなく、輪になるべきである。
• その各部分も、矩形になることは要求されない。ボーダー辺をなぞる所では、border-＊-radius による曲線もなぞるべきである。
• その位置は、子孫ボックスに影響され得る。【例えば、子孫ボックスが親ボックスからはみ出すときは、はみ出た部分も囲うように描かれるであろう。】

ユーザー エージェントは、利用者にフォーカスの概念を伝えるものとして 適切な領域を囲うような、外形線を決定するアルゴリズムを利用するべきである。

outline-width プロパティは、border-width【の個々の成分値】と同じ値を受容する。

開始<SPAN style="border:1px solid red;
 outline-width:10px;
 outline-style:dotted;
 outline-color:#0f0;
">テスト</SPAN>終了

開始<SPAN style="border:1px solid red;
 outline-width:thin;
 outline-style:dotted;
 outline-color:#0f0;
">テスト</SPAN>終了

開始<SPAN style="border:1px solid red;
 outline-width:medium;
 outline-style:dotted;
 outline-color:#0f0;
">テスト</SPAN>終了

開始<SPAN style="border:1px solid red;
 outline-width:thick;
 outline-style:dotted;
 outline-color:#0f0;
">テスト</SPAN>終了

テスト