Edit

Page

Page title:

Page body:

[28]
[CITE[[WebKit] CSS3のborderとbackground(一部)をサポート]] <http://d.hatena.ne.jp/eccoHowling/20050828#p1>
([[名無しさん]] [WEAK[2005-08-29 01:43:15 +00:00]])

[31]
[CITE@ja[Bug 4355 px以外の単位を使うとborderの太さが一定にならない - WebStudio]] ([CODE[2006-11-28 11:04:46 +09:00]] 版) <http://www.d-toybox.com/studio/weblog/show.php?mode=single&id=2006122802>
([[名無しさん]] [WEAK[2006-12-28 02:07:28 +00:00]])

[34]
[[WinIE 6]] では
[CODE(CSS)@en[[[border]]]]、[CODE(CSS)@en[[[border-top]]]]
などに
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0D%0A%20%20border%3A%20thin%200%20thick%20thin%200%200%200%200%200%200%201px%202em%2010mm%20red%20blue%200%20thick%20%23C0C0C0%20orange%20dashed%20none%20dotted%20inset%3B%0D%0A%7D%0D%0A;h=;p=n;x=style-element> のように値を1つ以上いくつでも指定できるようです。
[CODE(CSS)@en[[[border-color]]]]、[CODE(CSS)@en[[[border-style]]]]、
[CODE(CSS)@en[[[border-width]]]] それぞれで最後に指定された値が有効になります。指定されなかった種類はまったく設定されません 
([[CSS 2.1]] によれば[[初期値]]が設定されなければなりません)。
[CODE(DOMa)@en[[[border]]]] や [CODE(DOMa)@en[[[borderTop]]]]
などに値が設定されるのは、構成する3種類 (または3種類×4辺)
のすべてに値が設定されている場合のみのようです。
([[名無しさん]])

[35]
[[Firefox]] 2 や [[Opera]] 9 には >>34 のような[[奇癖]]はなく、
[[CSS 2.1]] 通りに実装しているようです。
([[名無しさん]])

[36]
色の[[初期値]]の扱いについては [CODE(CSS)@en[[[border-color]]]] の項を参照。

([[名無しさん]])

[37]
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0D%0A%20%20border-top%3A%20medium%20dotted%3B%0D%0A%7D%0D%0A;h=%3Cp%3E%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20sd%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0D%0A%20%20w%20(sd.borderTop)%3B%0D%0A%22%3E%3Ccode%3EgetComputedStyle%3C%2Fcode%3E%3C%2Fbutton%3E%0D%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20sd%20%3D%20el.currentStyle%3B%0D%0A%20%20w%20(sd.borderTop)%3B%0D%0A%22%3E%3Ccode%3EcurrentStyle%3C%2Fcode%3E%3C%2Fbutton%3E%0D%0A;p=n;x=style-element>
↑ こんな感じのやつででてくる値を調べてみた

[[Firefox]] 2 [CODE(DOMm)@en[[[getComputedStyle]]]]: [[空文字列]]

[[WinIE 6]] [CODE(DOMa)@en[[[currentStyle]]]]: 
[CODE(JS)@en[[[undefined]]]]
([CODE(DOMa)@en[[[currentStyle]]]] には [[shorthand]]
の[[DOM属性]]がないらしい)

[[Opera]] 9:
,指定した値	,[CODE(DOMm)@en[[[getComputedStyle]]]]	,[CODE(DOMa)@en[[[currentStyle]]]]
,[CODE(CSS)@en[[[medium]]]]	,[CODE(CSS)[0[[px]] #000000]]	,[CODE(CSS)[3[[px]]]]
,[CODE(CSS)@en[[[medium]] [[solid]]]]	,[CODE(CSS)[3[[px]] [[solid]] #000000]]	,[CODE(CSS)[3[[px]] [[solid]]]]
,[CODE(CSS)@en[10[[px]] [[dotted]]]]	,[CODE(CSS)[10[[px]] [[dotted]] #000000]]	,[CODE(CSS)[10[[px]] [[dotted]]]]
,[CODE(CSS)[10[[mm]] [[inset]] [[blue]]]]	,[CODE(CSS)[38[[px]] [[inset]] #0000ff]]	,[CODE(CSS)[10[[mm]] [[inset]] #0000ff]]

([[名無しさん]])

[38]
[CITE@en[border model - onderhond blog - onderhond.com]] ([CODE[2008-05-05 20:43:42 +09:00]] 版) <http://www.onderhond.com/blog/onderhond/border-model-inconsistencies>
([[名無しさん]])

[39]
[CITE@ja[テーブルのボーダーに余白がある場合のサンプル|CSS HappyLife]] ([TIME[2008-05-23 19:07:12 +09:00]] 版) <http://css-happylife.com/log/css-template/000356.shtml>

[61] [[Chrome]] も [[Firefox]] も [CODE(CSS)@en['[[border]]']] を指定すると
[CODE(CSS)@en['[[border-image]]']] が[[初期値]]になります。 [[Firefox]]
ではその他 [CODE(CSS)@en['[[-moz-border-top-colors]]']] なども[[初期値]]になります。 [TIME[2013-09-07T10:07:59.200Z]]

[62] [[Chrome]] は明示されていない[[プロパティー]]を [CODE(CSS)@en[[[initial]]]]
にしますが、 [[Firefox]] は実際の[[初期値]]にします。 [TIME[2013-09-07T10:08:38.000Z]]

;; [63] [[Firefox]] の [CODE(CSS)@en['[[border-color]]']] の[[初期値]]は
[CODE(CSS)@en['[[-moz-use-text-color]]']] です。

[64] [[直列化]]の際、 [[Chrome]] では [CODE(CSS)@en['[[border-width]]']]、
[CODE(CSS)@en['[[border-style]]']]、[CODE(CSS)@en['[[border-color]]']] の1つか2つが
[CODE(CSS)@en[[[initial]]]] なら、それが省略されます。3つが [CODE(CSS)@en[[[initial]]]]
なら[[プロパティー]]の[[宣言]]自体が [CODE(CSS)@en[[[cssText]]]] に現れません。 [TIME[2013-09-07T10:12:07.200Z]]

[65] [[直列化]]の際、 [[Firefox]] は [CODE(CSS)@en['[[border-color]]']]
が [CODE(CSS)@en['[[-moz-use-text-color]]']] ならそれを省略しますが、それ以外は省略しません。 [TIME[2013-09-07T10:12:57.300Z]]

[66] [CODE(CSS)@en['[[border]]']] を構文解析して [[CSSOM]] に[[宣言]]として追加する時の各 [[longhand sub-properties]]
の順序は [[Firefox]] と [[Chrome]] で違っています。 [TIME[2013-09-07T10:31:56.300Z]]

[67] [CODE(CSS)@en['[[border]]']] にまとめきれないときにどの[[プロパティー]]を使って表現するかは [[Chrome]]
と [[Firefox]] で異なるようです。 >>66 の順序の違いによるものか、それ以外にも違うのかはよくわかりません。 [TIME[2013-09-07T10:33:15.500Z]]

* 境界領域

[40] [[箱]]の[[余白領域]]と[[詰め領域]]の間の[[領域]]を[DFN[[RUBYB[境界領域]@en[border area]]]]といいます。

[42] [[CSS 2.1]] には「optional」と書いてあるので、幅 0 の時は厳密に言えば[[境界領域]]は存在しないということになります。

[43] [[境界領域]]の外周を[DFN[[RUBYB[境界辺]@en[border edge]]]]と呼びます。
[[境界領域]]が存在しない時は[[詰め辺]]と同じです。
[SRC@en[[[CSS 2.1]] 8.1]]

[44] [[境界辺]]に囲まれる領域を[DFN[[RUBYB[境界箱]@en[border box]]]]と呼びます。
[SRC@en[[[CSS 2.1]] 8.1]]

[47] [[詰め領域]]と[[境界領域]]の間に[[スクロール・バー]]が挿入されることがあります。

** 仕様書

[41] [CITE@en[Box model]] ([TIME[2007-07-18 02:08:55 +09:00]] 版) <http://www.w3.org/TR/2007/CR-CSS21-20070719/box.html#box-dimensions>

** 背景

[45] [[境界領域]]の[[背景]]は [CODE(CSS)@en[[[background]]]] に拠ります
[SRC@en[[[CSS 2.1]] 8.1]]。

** Viewport の境界箱

[46] [[Viewport境界箱]]の項を参照してください。

[48] [CITE@ja[小粋空間: CSS で table に斜線を引く方法]]
([TIME[2009-10-26 00:34:58 +09:00]] 版)
<http://www.koikikukan.com/archives/2009/10/26-000300.php>

[49] [CITE[Bug 452915 – Linked images have a blue border in default style sheet]]
([TIME[2010-03-02 15:08:24 +09:00]] 版)
<https://bugzilla.mozilla.org/show_bug.cgi?id=452915>

[50] [CITE['''['''whatwg''']''' borders on images inside links]]
([TIME[2010-04-08 08:58:43 +09:00]] 版)
<http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-April/025871.html>

[51] [CITE['''['''whatwg''']''' borders on images inside links]]
([TIME[2010-04-08 08:58:43 +09:00]] 版)
<http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-April/025871.html>

[52] [CITE['''['''whatwg''']''' borders on images inside links]]
([TIME[2010-07-29 07:27:58 +09:00]] 版)
<http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-July/027409.html>

[53] [CITE@en[Web Applications 1.0 r6008 7468]]
( ([TIME[2011-04-15 08:46:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=6007&to=6008>

[54] [CITE[IRC logs: freenode / #whatwg / 20110414]]
( ([TIME[2011-04-16 20:30:22 +09:00]] 版))
<http://krijnhoetmer.nl/irc-logs/whatwg/20110414#l-461>

[55] [CITE[IRC logs: freenode / #whatwg / 20110415]]
( ([TIME[2011-04-17 15:26:56 +09:00]] 版))
<http://krijnhoetmer.nl/irc-logs/whatwg/20110415#l-139>

[56] [CITE@en[HTML5 Tracker]]
([TIME[2011-10-14 12:11:06 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=6680&to=6681>

[57] [CITE@en[HTML5 Tracker]]
([TIME[2011-10-15 08:06:18 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=6683&to=6684>

[58] [CITE[NOTE-css-potential-19970819]]
( ([TIME[2000-03-13 23:37:56 +09:00]] 版))
<http://www.w3.org/TR/NOTE-css-potential-19970819#pgfId=1028243>

[59] [CITE@en[Web Applications 1.0 r7189  Revert the parts of r6008 that made <table border> conforming again. See http://lists.w3.org/Archives/Public/public-html/2011Apr/0419.html for the reasoning.]]
( ([TIME[2012-07-20 12:48:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=7188&to=7189>

[60] [CITE@en[Web Applications 1.0 r7623     Not sure why this was limited to hyperlinks only.]]
( ([TIME[2012-12-31 13:53:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=7622&to=7623>

[68] [CITE@en[Re: Working Group Decision on ISSUE-155 table-border]]
( ([[Tab Atkins Jr.]] 著, [TIME[2011-04-16 03:30:22 +09:00]] 版))
<http://lists.w3.org/Archives/Public/public-html/2011Apr/0419.html>

[1] [CITE[OASIS Open Document Format for Office Applications (OpenDocument) Version 1.2 - Part 1: OpenDocument Schema]]
([TIME[2011-09-29 13:00:00 +09:00]] 版)
<http://docs.oasis-open.org/office/v1.2/os/OpenDocument-v1.2-os-part1.html#a20_176fo_Border_Properties>

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)