mirror of
https://github.com/servo/servo.git
synced 2025-08-07 22:45:34 +01:00
Update CSS tests to revision e102a993c37a2e0ebd549bc7d5548b006458ab34
This commit is contained in:
Ms2ger
parent
037cac7353
commit
a00f2d6310
479 changed files with 13629 additions and 1611 deletions
|
|
@ -1,11 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<title>CSS Backgroud and Borders Test:backgrond-clip_content-box</title>
|
||||
<title>CSS Background and Borders Test:background-clip_content-box</title>
|
||||
<link href="mailto:zhuanping123@163.com" rel="author" title="anping">
|
||||
<link href="http://www.w3.org/TR/css3-background/#the-background-clip" rel="help">
|
||||
<meta content="reference/reference.html" name="match">
|
||||
<meta content="Test passes if the backgrond color is limited to the content only and border is blue dotted without red" name="assert">
|
||||
<meta content="Test passes if the background color is limited to the content only and border is blue dotted without red" name="assert">
|
||||
|
||||
<style>
|
||||
div{
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
|
||||
</head><body>
|
||||
<p>
|
||||
"Test passes if the backgrond color is limited to the content only and border is blue dotted without red."
|
||||
"Test passes if the background color is limited to the content only and border is blue dotted without red."
|
||||
</p>
|
||||
<div id="container">
|
||||
<div id="test"></div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<title> CSS Backgroud Border Test: "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div</title>
|
||||
<title> CSS Background Border Test: "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div</title>
|
||||
<link href="http://www.intel.com" rel="author" title="Intel">
|
||||
<link href="http://www.w3.org/TR/css3-background/#the-border-image-repeat" rel="help">
|
||||
<meta content="Check if 'border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px' work on div" name="assert">
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-slice" title="6.2. Image Slicing: the 'border-image-slice' property">
|
||||
<link rel="match" href="reference/ref-if-there-is-no-red.htm">
|
||||
<meta name="flags" content="image">
|
||||
<meta name="assert" content="If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test.">
|
||||
<meta name="assert" content="If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test.">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
|
|
|
|||
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
|
||||
<head>
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property">
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.htm">
|
||||
|
||||
<meta name="flags" content="image">
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element." name="assert">
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css">
|
||||
p
|
||||
{
|
||||
margin-bottom: 41px; /* border-image-outset + 16px (1em) .
|
||||
This 41px margin-bottom value is just to position the rendered layout to accurately match the reference file . */
|
||||
}
|
||||
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 25px 25px 25px 25px; /* The border-image-outset values specify the amount by which the border image area *_ extends beyond the border box_*. */
|
||||
height: 20px;
|
||||
margin-left: 25px; /* == border-image-outset . This margin-left value is just to position the rendered layout to accurately match the reference file . */
|
||||
padding: 15px 15px 15px 15px;
|
||||
width: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
|
||||
<head>
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property">
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.htm">
|
||||
|
||||
<meta name="flags" content="image">
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element." name="assert">
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css">
|
||||
p
|
||||
{
|
||||
margin-bottom: 41px; /* border-image-outset + 16px (1em) .
|
||||
This 41px margin-bottom value is just to position the rendered layout to accurately match the reference file . */
|
||||
}
|
||||
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 25px 25px 25px 25px; /* The border-image-outset values specify the amount by which the border image area *_ extends beyond the border box_*. */
|
||||
height: 0px;
|
||||
margin-left: 25px; /* == border-image-outset . This margin-left value is just to position the rendered layout to accurately match the reference file . */
|
||||
padding: 25px 25px 25px 25px;
|
||||
width: 0px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
|
||||
<head>
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property">
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.htm">
|
||||
|
||||
<meta name="flags" content="image">
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element." name="assert">
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 50px 50px 50px 50px; /* The border-image-outset values specify the amount by which the border image area !_ extends beyond the border box_!. */
|
||||
height: 0px;
|
||||
margin: 66px 50px 50px 50px;
|
||||
/* Why 66px ? In order to take into consideration the fact that the margin-bottom (16px) of the p element will collapse with the top margin of the div element. */
|
||||
width: 0px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1096,9 +1096,9 @@
|
|||
<a href="background-clip-content-box.htm">background-clip-content-box</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>backgrond-clip_content-box
|
||||
<td>background-clip_content-box
|
||||
<ul class="assert">
|
||||
<li>Test passes if the backgrond color is limited to the content only and border is blue dotted without red</li>
|
||||
<li>Test passes if the background color is limited to the content only and border is blue dotted without red</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Backgrounds and Borders Module Level 3 CR Test Suite</h1>
|
||||
<h2>Border Images (34 tests)</h2>
|
||||
<h2>Border Images (37 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column">
|
||||
<col id="refs-column">
|
||||
|
|
@ -142,7 +142,7 @@
|
|||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border-image-slice - border-style: none
|
||||
<ul class="assert">
|
||||
<li>If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test.</li>
|
||||
<li>If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -234,7 +234,7 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s6.3">+</a>
|
||||
<a href="http://www.w3.org/TR/css3-background/#the-border-image-width">6.3 Drawing Areas: the ‘border-image-width’ property</a></th></tr>
|
||||
<!-- 4 tests -->
|
||||
<!-- 7 tests -->
|
||||
<tr id="border-image-10-6.3" class="primary">
|
||||
<td><strong>
|
||||
<a href="border-image-10.htm">border-image-10</a></strong></td>
|
||||
|
|
@ -279,6 +279,39 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-005-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-005.htm">border-image-width-005</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-006-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-006.htm">border-image-width-006</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-007-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-007.htm">border-image-width-007</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s6.3.#auto0">
|
||||
<!-- 0 tests -->
|
||||
|
|
|
|||
|
|
@ -1472,6 +1472,30 @@
|
|||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-005" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-005.htm">border-image-width-005</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-006" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-006.htm">border-image-width-006</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-007" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-007.htm">border-image-width-007</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-radius-001" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="Borders. border">
|
||||
|
|
|
|||
|
|
@ -180,6 +180,9 @@ border-image-slice-002.htm == reference/ref-filled-green-100px-square.htm
|
|||
border-image-slice-003.htm == reference/ref-if-there-is-no-red.htm
|
||||
border-image-slice-percentage.htm == reference/border-image-slice-percentage-ref.htm
|
||||
border-image-space-001.htm == reference/border-image-space-001-ref.htm
|
||||
border-image-width-005.htm == reference/ref-filled-green-100px-square.htm
|
||||
border-image-width-006.htm == reference/ref-filled-green-100px-square.htm
|
||||
border-image-width-007.htm == reference/ref-filled-green-100px-square.htm
|
||||
border-radius-001.htm == reference/border-radius-001-ref.htm
|
||||
border-radius-002.htm == reference/border-radius-002-ref.htm
|
||||
border-radius-003.htm == reference/border-radius-003-ref.htm
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
<tbody id="s6">
|
||||
<tr><th><a href="chapter-6.htm">Chapter 6 -
|
||||
Border Images</a></th>
|
||||
<td>(34 Tests)</td></tr>
|
||||
<td>(37 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s7">
|
||||
<tr><th><a href="chapter-7.htm">Chapter 7 -
|
||||
|
|
|
|||
|
|
@ -127,8 +127,8 @@ html4/background-clip-010.htm 40f96f532a8862c14b7b74aff3900b454652d208 ?
|
|||
xhtml1/background-clip-010.xht 40f96f532a8862c14b7b74aff3900b454652d208 ?
|
||||
html4/background-clip-content-box-001.htm 8094a6ab3cb8e6155109f6e24416d2ac7c5e93b4 ?
|
||||
xhtml1/background-clip-content-box-001.xht 8094a6ab3cb8e6155109f6e24416d2ac7c5e93b4 ?
|
||||
html4/background-clip-content-box.htm a0aae7c775f2d9f6527f7d723ecae69f30330379 ?
|
||||
xhtml1/background-clip-content-box.xht a0aae7c775f2d9f6527f7d723ecae69f30330379 ?
|
||||
html4/background-clip-content-box.htm 992c806e87f67434545a16f665befe9fad4129be ?
|
||||
xhtml1/background-clip-content-box.xht 992c806e87f67434545a16f665befe9fad4129be ?
|
||||
html4/background-clip-padding-box-with-border-radius.htm 2f60b410f132cba65c5c8360403f369129deb3ab ?
|
||||
xhtml1/background-clip-padding-box-with-border-radius.xht 2f60b410f132cba65c5c8360403f369129deb3ab ?
|
||||
html4/background-clip-root.htm 7fa6b5415bc6624809f4dfd162e3eb004938f10d ?
|
||||
|
|
@ -483,16 +483,16 @@ html4/border-image-9.htm 91220d234be891f0b01d1a4974f275a9f2578500 ?
|
|||
xhtml1/border-image-9.xht 91220d234be891f0b01d1a4974f275a9f2578500 ?
|
||||
html4/border-image-repeat-round.htm b836a0f6c592deacbb97c84c18d9c5ca865546f5 ?
|
||||
xhtml1/border-image-repeat-round.xht b836a0f6c592deacbb97c84c18d9c5ca865546f5 ?
|
||||
html4/border-image-repeat_repeatnegx_none_50px.htm 74c35522b78dc93b05bbf21d4a5ee4a53f1cd964 ?
|
||||
xhtml1/border-image-repeat_repeatnegx_none_50px.xht 74c35522b78dc93b05bbf21d4a5ee4a53f1cd964 ?
|
||||
html4/border-image-repeat_repeatnegx_none_50px.htm 94f97e6cd1b259175ac8416a9aacc9245da46137 ?
|
||||
xhtml1/border-image-repeat_repeatnegx_none_50px.xht 94f97e6cd1b259175ac8416a9aacc9245da46137 ?
|
||||
html4/border-image-round-and-stretch.htm 61e31f23f23594e6601a05e99de02a239dae3971 ?
|
||||
xhtml1/border-image-round-and-stretch.xht 61e31f23f23594e6601a05e99de02a239dae3971 ?
|
||||
html4/border-image-slice-001.htm 65c72cac44f48927ec95a402775c42d8f17d480d ?
|
||||
xhtml1/border-image-slice-001.xht 65c72cac44f48927ec95a402775c42d8f17d480d ?
|
||||
html4/border-image-slice-002.htm c8d317551460dd21040412489996a6c738894628 ?
|
||||
xhtml1/border-image-slice-002.xht c8d317551460dd21040412489996a6c738894628 ?
|
||||
html4/border-image-slice-003.htm 2a0dfc8496d5d5a90972a635ced57cc9b3a26ea2 ?
|
||||
xhtml1/border-image-slice-003.xht 2a0dfc8496d5d5a90972a635ced57cc9b3a26ea2 ?
|
||||
html4/border-image-slice-003.htm a5913c6b88348d0b12a209bd71ec2c103774b023 ?
|
||||
xhtml1/border-image-slice-003.xht a5913c6b88348d0b12a209bd71ec2c103774b023 ?
|
||||
html4/border-image-slice-005.htm c795fb86f3a99c061832e0c3f708bf7c8650a895 ?
|
||||
xhtml1/border-image-slice-005.xht c795fb86f3a99c061832e0c3f708bf7c8650a895 ?
|
||||
html4/border-image-slice-007.htm f425ef8e3feb8e574627efb81478a607bd715055 ?
|
||||
|
|
@ -501,6 +501,12 @@ html4/border-image-slice-percentage.htm 96c66681062840b53a027278203512f40dc13523
|
|||
xhtml1/border-image-slice-percentage.xht 96c66681062840b53a027278203512f40dc13523 ?
|
||||
html4/border-image-space-001.htm 7f295d8a8471c3a6127a95f0cceb6be824571926 ?
|
||||
xhtml1/border-image-space-001.xht 7f295d8a8471c3a6127a95f0cceb6be824571926 ?
|
||||
html4/border-image-width-005.htm 47ab5e74473b7f20a1169762d5e5fcf7d3470fc3 ?
|
||||
xhtml1/border-image-width-005.xht 47ab5e74473b7f20a1169762d5e5fcf7d3470fc3 ?
|
||||
html4/border-image-width-006.htm 2ea7bd90dc8932a918484cc2ac561dfa2595f903 ?
|
||||
xhtml1/border-image-width-006.xht 2ea7bd90dc8932a918484cc2ac561dfa2595f903 ?
|
||||
html4/border-image-width-007.htm 2a85b176999c43cfbdbb6dd1676c551cc1098475 ?
|
||||
xhtml1/border-image-width-007.xht 2a85b176999c43cfbdbb6dd1676c551cc1098475 ?
|
||||
html4/border-images.htm 4d4052e1cc45e8c09db0459361452d1b5d5fd146 ?
|
||||
xhtml1/border-images.xht 4d4052e1cc45e8c09db0459361452d1b5d5fd146 ?
|
||||
html4/border-radius-001.htm 22d31b007dbf51ddee05647a7fd69ab97913e105 ?
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ background-clip-007 reference/ref-if-there-is-no-red background-clip: content-bo
|
|||
background-clip-008 reference/ref-if-there-is-no-red background-clip: padding-box with background-color http://www.w3.org/TR/css3-background/#the-background-clip 4fb20f112375611b85cb273c0080f50bcbe4adbe `Julien Chaffraix`<mailto:jchaffraix@webkit.org>,`Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> When 'background-clip' is set to 'padding-box', then the background painting area is clipped at the edges of the padding of the element. In this test, the padding box is 0px tall and as wide as the body element; therefore, red should not be visible.
|
||||
background-clip-009 reference/ref-filled-black-96px-square background-clip: border-box with background-color http://www.w3.org/TR/css3-background/#the-background-clip 6dfbfd7ba1adc4a2fd06435210345e875f60512e `Julien Chaffraix`<mailto:jchaffraix@webkit.org>,`Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> When 'background-clip' is set to 'border-box', then the background painting area is clipped at the edges of the borders of the element. In this test, the border box is 96px tall and 96px wide and is made from only the borders.
|
||||
background-clip-010 reference/ref-if-there-is-no-red background-clip - content-box with background-color http://www.w3.org/TR/css3-background/#the-background-clip 40f96f532a8862c14b7b74aff3900b454652d208 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> When 'background-clip' is set to 'content-box', then the background painting area is clipped at the edges of the content of the element. In this test, height is 'auto', therefore its used value is '0px'; width is 'auto', therefore its used value is as wide as the body element. So, the content box is 0px tall and as wide as the body element; therefore, red should not be visible.
|
||||
background-clip-content-box backgrond-clip_content-box http://www.w3.org/TR/css3-background/#the-background-clip a0aae7c775f2d9f6527f7d723ecae69f30330379 `anping`<mailto:zhuanping123@163.com> Test passes if the backgrond color is limited to the content only and border is blue dotted without red
|
||||
background-clip-content-box background-clip_content-box http://www.w3.org/TR/css3-background/#the-background-clip 992c806e87f67434545a16f665befe9fad4129be `anping`<mailto:zhuanping123@163.com> Test passes if the background color is limited to the content only and border is blue dotted without red
|
||||
background-clip-content-box-001 reference/background-clip-content-box-ref background-clip Reference http://www.w3.org/TR/css3-background/#the-background-clip 8094a6ab3cb8e6155109f6e24416d2ac7c5e93b4 `James Wang`<mailto:wangjian@ucweb.com> background-clip with content-box means paint the background within the content box
|
||||
background-clip-padding-box-with-border-radius background-clip: padding-box with border-radius http://www.w3.org/TR/css3-background/#the-background-clip,http://www.w3.org/TR/css3-background/#corner-shaping 2f60b410f132cba65c5c8360403f369129deb3ab `Lea Verou`<http://lea.verou.me> Backgrounds clipped to the padding box should follow the padding box curve, which should be equal to the outer border radius minus the corresponding border thickness.
|
||||
background-clip-root background-clip on root image http://www.w3.org/TR/css3-background/#the-background-clip 7fa6b5415bc6624809f4dfd162e3eb004938f10d `Lea Verou`<http://lea.verou.me> The root element has a different background painting area, and thus the 'background-clip' property has no effect when specified on it.
|
||||
|
|
@ -239,15 +239,18 @@ border-image-7 CSS Border and Background: border-image #7 border-image-width h
|
|||
border-image-8 CSS Border and Background: border-image #8 border-image-width http://www.w3.org/TR/css3-background/#the-border-image-width 902b4d33531f4f22cc86b4a6072db50e9b73c351 `Jérémie Patonnier`<mailto:jeremie@patonnier.net> Support for 2 values for the border-image-width property
|
||||
border-image-9 CSS Border and Background: border-image #9 border-image-width http://www.w3.org/TR/css3-background/#the-border-image-width 91220d234be891f0b01d1a4974f275a9f2578500 `Jérémie Patonnier`<mailto:jeremie@patonnier.net> Support for 3 values for the border-image-width property
|
||||
border-image-repeat-round reference/border-image-repeat-round-ref 'border-image-repeat' set as 'round' http://www.w3.org/TR/css3-background/#border-images b836a0f6c592deacbb97c84c18d9c5ca865546f5 `Ren Jing`<mailto:reni2046@gmail.com> diamonds in corners should be red, and other diamonds should be orange, it should be 4 orange diamonds on each side.
|
||||
border-image-repeat_repeatnegx_none_50px "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div script http://www.w3.org/TR/css3-background/#the-border-image-repeat 74c35522b78dc93b05bbf21d4a5ee4a53f1cd964 `Intel`<http://www.intel.com> Check if 'border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px' work on div
|
||||
border-image-repeat_repeatnegx_none_50px "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div script http://www.w3.org/TR/css3-background/#the-border-image-repeat 94f97e6cd1b259175ac8416a9aacc9245da46137 `Intel`<http://www.intel.com> Check if 'border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px' work on div
|
||||
border-image-round-and-stretch reference/border-image-round-and-stretch-ref 'border-image' set as 'round' and 'stretch' http://www.w3.org/TR/css3-background/#border-images 61e31f23f23594e6601a05e99de02a239dae3971 `Ren Jing`<mailto:reni2046@gmail.com> orange diamonds on top and bottom border should be repeated 12 times, and orange diamonds on left and right border should be stretched, diamonds in corners should be red, and other diamonds should be orange.
|
||||
border-image-slice-001 reference/ref-filled-green-100px-square border-image-slice - <percentage> image http://www.w3.org/TR/css3-background/#the-border-image-slice 65c72cac44f48927ec95a402775c42d8f17d480d `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> Percentage values for 'border-image-slice' are relative to the size of the image: the width of the image for the horizontal (left and right) offsets, the height for vertical (top and bottom) offsets. 'border-image-slice' specifies inward offsets from the top, right, bottom, and left edges (in that order) of the image. In this test, the image serving as 'border-image-source' is a 100px by 100px image which has 5px of green at the top, 10px of green on the right, 15px of green at the bottom and 20px of green at the left; the remaining center (which has a width of 70px and a height of 80px) is all red.
|
||||
border-image-slice-002 reference/ref-filled-green-100px-square border-image-slice - <number> image http://www.w3.org/TR/css3-background/#the-border-image-slice c8d317551460dd21040412489996a6c738894628 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> Number values for 'border-image-slice' are pixels in the image: the width of the image for the horizontal (left and right) offsets, the height for vertical (top and bottom) offsets. 'border-image-slice' specifies inward offsets from the top, right, bottom, and left edges (in that order) of the image. In this test, the image serving as 'border-image-source' is a 100px by 100px image which has 5px of green at the top, 10px of green on the right, 15px of green at the bottom and 20px of green at the left; the remaining center (which has a width of 70px and a height of 80px) is all red.
|
||||
border-image-slice-003 reference/ref-if-there-is-no-red border-image-slice - border-style: none image http://www.w3.org/TR/css3-background/#the-border-image-slice 2a0dfc8496d5d5a90972a635ced57cc9b3a26ea2 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test.
|
||||
border-image-slice-003 reference/ref-if-there-is-no-red border-image-slice - border-style: none image http://www.w3.org/TR/css3-background/#the-border-image-slice a5913c6b88348d0b12a209bd71ec2c103774b023 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test.
|
||||
border-image-slice-005 The 'border-image-slice' property with four percentage values image http://www.w3.org/TR/css3-background/#the-border-image-slice c795fb86f3a99c061832e0c3f708bf7c8650a895 `Microsoft`<http://www.microsoft.com/> This test checks that the border image is sliced into nine regions with inward offsets, '40%' from the top, '15%' from the right,'20%' from the bottom, and '5%' from the left edges of the image. Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets.
|
||||
border-image-slice-007 The 'border-image-slice' property with the 'fill' keyword image http://www.w3.org/TR/css3-background/#the-border-image-slice f425ef8e3feb8e574627efb81478a607bd715055 `Microsoft`<http://www.microsoft.com/> This test checks that the 'fill' keyword, if present, causes the middle part of the border-image to be preserved.
|
||||
border-image-slice-percentage reference/border-image-slice-percentage-ref 'border-image-slice' set by percentage http://www.w3.org/TR/css3-background/#border-images 96c66681062840b53a027278203512f40dc13523 `Ren Jing`<mailto:reni2046@gmail.com> diamonds in corners should be red, and other diamonds should be orange, it should be 4 orange diamonds on each side.
|
||||
border-image-space-001 reference/border-image-space-001-ref Border Image: box with spaced repeating border image http://www.w3.org/TR/css3-background/#the-border-image-repeat 7f295d8a8471c3a6127a95f0cceb6be824571926 `Levi Weintraub`<mailto:leviw@chromium.org> border-image-repeat: space property spaces out background image that doesn't fit an even number of times.
|
||||
border-image-width-005 reference/ref-filled-green-100px-square border image area - border-image-width image http://www.w3.org/TR/css3-background/#the-border-image-width 47ab5e74473b7f20a1169762d5e5fcf7d3470fc3 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.
|
||||
border-image-width-006 reference/ref-filled-green-100px-square border image area - border-image-width image http://www.w3.org/TR/css3-background/#the-border-image-width 2ea7bd90dc8932a918484cc2ac561dfa2595f903 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.
|
||||
border-image-width-007 reference/ref-filled-green-100px-square border image area - border-image-width image http://www.w3.org/TR/css3-background/#the-border-image-width 2a85b176999c43cfbdbb6dd1676c551cc1098475 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element.
|
||||
border-images border-images with round repeat image http://www.w3.org/TR/css3-background/#the-border-image 4d4052e1cc45e8c09db0459361452d1b5d5fd146 `babyliner`<mailto:babyliner1026@gmail.com> Testing border-image-repeat:round attribute
|
||||
border-radius-001 reference/border-radius-001-ref Borders. border http://www.w3.org/TR/css3-background/#the-border-radius 22d31b007dbf51ddee05647a7fd69ab97913e105 `Nokia`<http://www.nokia.com/> To verify when border-radius property, when set to zero, works as expected.
|
||||
border-radius-002 reference/border-radius-002-ref Borders. border http://www.w3.org/TR/css3-background/#the-border-radius e00cce42f431e13f9109bc7454ef6176b52bdd6c `Nokia`<http://www.nokia.com/> To verify border-radius property set with one length value, works as expected
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
|
||||
<title>CSS Backgroud and Borders Test:backgrond-clip_content-box</title>
|
||||
<title>CSS Background and Borders Test:background-clip_content-box</title>
|
||||
<link href="mailto:zhuanping123@163.com" rel="author" title="anping" />
|
||||
<link href="http://www.w3.org/TR/css3-background/#the-background-clip" rel="help" />
|
||||
<meta content="reference/reference.html" name="match" />
|
||||
<meta content="Test passes if the backgrond color is limited to the content only and border is blue dotted without red" name="assert" />
|
||||
<meta content="Test passes if the background color is limited to the content only and border is blue dotted without red" name="assert" />
|
||||
|
||||
<style>
|
||||
div{
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
|
||||
</head><body>
|
||||
<p>
|
||||
"Test passes if the backgrond color is limited to the content only and border is blue dotted without red."
|
||||
"Test passes if the background color is limited to the content only and border is blue dotted without red."
|
||||
</p>
|
||||
<div id="container">
|
||||
<div id="test"></div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title> CSS Backgroud Border Test: "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div</title>
|
||||
<title> CSS Background Border Test: "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div</title>
|
||||
<link href="http://www.intel.com" rel="author" title="Intel" />
|
||||
<link href="http://www.w3.org/TR/css3-background/#the-border-image-repeat" rel="help" />
|
||||
<meta content="Check if 'border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px' work on div" name="assert" />
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-slice" title="6.2. Image Slicing: the 'border-image-slice' property" />
|
||||
<link rel="match" href="reference/ref-if-there-is-no-red.xht" />
|
||||
<meta name="flags" content="image" />
|
||||
<meta name="assert" content="If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test." />
|
||||
<meta name="assert" content="If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test." />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
|
|||
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property" />
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<meta name="flags" content="image" />
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element." name="assert" />
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
p
|
||||
{
|
||||
margin-bottom: 41px; /* border-image-outset + 16px (1em) .
|
||||
This 41px margin-bottom value is just to position the rendered layout to accurately match the reference file . */
|
||||
}
|
||||
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 25px 25px 25px 25px; /* The border-image-outset values specify the amount by which the border image area *_ extends beyond the border box_*. */
|
||||
height: 20px;
|
||||
margin-left: 25px; /* == border-image-outset . This margin-left value is just to position the rendered layout to accurately match the reference file . */
|
||||
padding: 15px 15px 15px 15px;
|
||||
width: 20px;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property" />
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<meta name="flags" content="image" />
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element." name="assert" />
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
p
|
||||
{
|
||||
margin-bottom: 41px; /* border-image-outset + 16px (1em) .
|
||||
This 41px margin-bottom value is just to position the rendered layout to accurately match the reference file . */
|
||||
}
|
||||
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 25px 25px 25px 25px; /* The border-image-outset values specify the amount by which the border image area *_ extends beyond the border box_*. */
|
||||
height: 0px;
|
||||
margin-left: 25px; /* == border-image-outset . This margin-left value is just to position the rendered layout to accurately match the reference file . */
|
||||
padding: 25px 25px 25px 25px;
|
||||
width: 0px;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property" />
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<meta name="flags" content="image" />
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element." name="assert" />
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 50px 50px 50px 50px; /* The border-image-outset values specify the amount by which the border image area !_ extends beyond the border box_!. */
|
||||
height: 0px;
|
||||
margin: 66px 50px 50px 50px;
|
||||
/* Why 66px ? In order to take into consideration the fact that the margin-bottom (16px) of the p element will collapse with the top margin of the div element. */
|
||||
width: 0px;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1096,9 +1096,9 @@
|
|||
<a href="background-clip-content-box.xht">background-clip-content-box</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>backgrond-clip_content-box
|
||||
<td>background-clip_content-box
|
||||
<ul class="assert">
|
||||
<li>Test passes if the backgrond color is limited to the content only and border is blue dotted without red</li>
|
||||
<li>Test passes if the background color is limited to the content only and border is blue dotted without red</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Backgrounds and Borders Module Level 3 CR Test Suite</h1>
|
||||
<h2>Border Images (34 tests)</h2>
|
||||
<h2>Border Images (37 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
|
|
@ -142,7 +142,7 @@
|
|||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border-image-slice - border-style: none
|
||||
<ul class="assert">
|
||||
<li>If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test.</li>
|
||||
<li>If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -234,7 +234,7 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s6.3">+</a>
|
||||
<a href="http://www.w3.org/TR/css3-background/#the-border-image-width">6.3 Drawing Areas: the ‘border-image-width’ property</a></th></tr>
|
||||
<!-- 4 tests -->
|
||||
<!-- 7 tests -->
|
||||
<tr id="border-image-10-6.3" class="primary">
|
||||
<td><strong>
|
||||
<a href="border-image-10.xht">border-image-10</a></strong></td>
|
||||
|
|
@ -279,6 +279,39 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-005-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-005.xht">border-image-width-005</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-006-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-006.xht">border-image-width-006</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-007-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-007.xht">border-image-width-007</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s6.3.#auto0">
|
||||
<!-- 0 tests -->
|
||||
|
|
|
|||
|
|
@ -1472,6 +1472,30 @@
|
|||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-005" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-005.xht">border-image-width-005</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-006" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-006.xht">border-image-width-006</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-007" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-007.xht">border-image-width-007</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-radius-001" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="Borders. border">
|
||||
|
|
|
|||
|
|
@ -180,6 +180,9 @@ border-image-slice-002.xht == reference/ref-filled-green-100px-square.xht
|
|||
border-image-slice-003.xht == reference/ref-if-there-is-no-red.xht
|
||||
border-image-slice-percentage.xht == reference/border-image-slice-percentage-ref.xht
|
||||
border-image-space-001.xht == reference/border-image-space-001-ref.xht
|
||||
border-image-width-005.xht == reference/ref-filled-green-100px-square.xht
|
||||
border-image-width-006.xht == reference/ref-filled-green-100px-square.xht
|
||||
border-image-width-007.xht == reference/ref-filled-green-100px-square.xht
|
||||
border-radius-001.xht == reference/border-radius-001-ref.xht
|
||||
border-radius-002.xht == reference/border-radius-002-ref.xht
|
||||
border-radius-003.xht == reference/border-radius-003-ref.xht
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
<tbody id="s6">
|
||||
<tr><th><a href="chapter-6.xht">Chapter 6 -
|
||||
Border Images</a></th>
|
||||
<td>(34 Tests)</td></tr>
|
||||
<td>(37 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s7">
|
||||
<tr><th><a href="chapter-7.xht">Chapter 7 -
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
|
||||
<title>CSS Backgroud and Borders Test:backgrond-clip_content-box</title>
|
||||
<title>CSS Background and Borders Test:background-clip_content-box</title>
|
||||
<link href="mailto:zhuanping123@163.com" rel="author" title="anping" />
|
||||
<link href="http://www.w3.org/TR/css3-background/#the-background-clip" rel="help" />
|
||||
<meta content="reference/reference.html" name="match" />
|
||||
<meta content="Test passes if the backgrond color is limited to the content only and border is blue dotted without red" name="assert" />
|
||||
<meta content="Test passes if the background color is limited to the content only and border is blue dotted without red" name="assert" />
|
||||
|
||||
<style>
|
||||
div{
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
|
||||
</head><body>
|
||||
<p>
|
||||
"Test passes if the backgrond color is limited to the content only and border is blue dotted without red."
|
||||
"Test passes if the background color is limited to the content only and border is blue dotted without red."
|
||||
</p>
|
||||
<div id="container">
|
||||
<div id="test"></div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title> CSS Backgroud Border Test: "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div</title>
|
||||
<title> CSS Background Border Test: "border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px" on test div</title>
|
||||
<link href="http://www.intel.com" rel="author" title="Intel" />
|
||||
<link href="http://www.w3.org/TR/css3-background/#the-border-image-repeat" rel="help" />
|
||||
<meta content="Check if 'border-image-repeat:repeat-x;height:200px;width:200px;border-image-source:none;border-image-width:50px' work on div" name="assert" />
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-slice" title="6.2. Image Slicing: the 'border-image-slice' property" />
|
||||
<link rel="match" href="reference/ref-if-there-is-no-red.xht" />
|
||||
<meta name="flags" content="image" />
|
||||
<meta name="assert" content="If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test." />
|
||||
<meta name="assert" content="If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test." />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
|
|||
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Backgrounds and Borders Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test border-image-width-005"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property" />
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<meta name="flags" content="image" />
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element." name="assert" />
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
p
|
||||
{
|
||||
margin-bottom: 41px; /* border-image-outset + 16px (1em) .
|
||||
This 41px margin-bottom value is just to position the rendered layout to accurately match the reference file . */
|
||||
}
|
||||
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 25px 25px 25px 25px; /* The border-image-outset values specify the amount by which the border image area *_ extends beyond the border box_*. */
|
||||
height: 20px;
|
||||
margin-left: 25px; /* == border-image-outset . This margin-left value is just to position the rendered layout to accurately match the reference file . */
|
||||
padding: 15px 15px 15px 15px;
|
||||
width: 20px;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Backgrounds and Borders Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test border-image-width-006"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property" />
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<meta name="flags" content="image" />
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element." name="assert" />
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
p
|
||||
{
|
||||
margin-bottom: 41px; /* border-image-outset + 16px (1em) .
|
||||
This 41px margin-bottom value is just to position the rendered layout to accurately match the reference file . */
|
||||
}
|
||||
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 25px 25px 25px 25px; /* The border-image-outset values specify the amount by which the border image area *_ extends beyond the border box_*. */
|
||||
height: 0px;
|
||||
margin-left: 25px; /* == border-image-outset . This margin-left value is just to position the rendered layout to accurately match the reference file . */
|
||||
padding: 25px 25px 25px 25px;
|
||||
width: 0px;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Backgrounds and Borders Test: border image area - border-image-width</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Backgrounds and Borders Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test border-image-width-007"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
||||
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-width" title="6.3. Drawing Areas: the 'border-image-width' property" />
|
||||
<link rel="match" href="reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<meta name="flags" content="image" />
|
||||
<meta content="This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element." name="assert" />
|
||||
|
||||
<!--
|
||||
created 2015-11-18
|
||||
[css-backgrounds] Please remove the "unless there is a border image" wording
|
||||
http://lists.w3.org/Archives/Public/www-style/2015Nov/0258.html
|
||||
-->
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
{
|
||||
background-color: red;
|
||||
border-color: red;
|
||||
border-style: none; /* or border-style: dotted or any other 'border-style' value */
|
||||
border-width: 0px; /* so the border belt (or border area) of the element is 0px tall and 0px wide */
|
||||
border-image-source: url("support/outline-5px-10px-15px-20px-green.png");
|
||||
border-image-slice: 5% 10% 15% 20%; /* <number> Percentages are relative to the size of the image: the width of the image for the horizontal offsets, the height for vertical offsets. */
|
||||
border-image-width: 50px; /* The four values of ‘border-image-width’ specify offsets that are used to divide the border image area into nine parts. They represent inward distances from the the top, right, bottom, and left sides of the area, respectively. */
|
||||
border-image-outset: 50px 50px 50px 50px; /* The border-image-outset values specify the amount by which the border image area !_ extends beyond the border box_!. */
|
||||
height: 0px;
|
||||
margin: 66px 50px 50px 50px;
|
||||
/* Why 66px ? In order to take into consideration the fact that the margin-bottom (16px) of the p element will collapse with the top margin of the div element. */
|
||||
width: 0px;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1096,9 +1096,9 @@
|
|||
<a href="background-clip-content-box.xht">background-clip-content-box</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>backgrond-clip_content-box
|
||||
<td>background-clip_content-box
|
||||
<ul class="assert">
|
||||
<li>Test passes if the backgrond color is limited to the content only and border is blue dotted without red</li>
|
||||
<li>Test passes if the background color is limited to the content only and border is blue dotted without red</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Backgrounds and Borders Module Level 3 CR Test Suite</h1>
|
||||
<h2>Border Images (34 tests)</h2>
|
||||
<h2>Border Images (37 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
|
|
@ -142,7 +142,7 @@
|
|||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border-image-slice - border-style: none
|
||||
<ul class="assert">
|
||||
<li>If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0. So, we should see no red in this test.</li>
|
||||
<li>If 'border-style' is not declared, then it defaults to 'none' in which case the computed border-widths on all 4 sides is 0 in which case the border area to be painted with the border-image is also 0 because the default border-image-width is 1 which means 1 time the computed border-width. So, we should see no red in this test.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -234,7 +234,7 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s6.3">+</a>
|
||||
<a href="http://www.w3.org/TR/css3-background/#the-border-image-width">6.3 Drawing Areas: the ‘border-image-width’ property</a></th></tr>
|
||||
<!-- 4 tests -->
|
||||
<!-- 7 tests -->
|
||||
<tr id="border-image-10-6.3" class="primary">
|
||||
<td><strong>
|
||||
<a href="border-image-10.xht">border-image-10</a></strong></td>
|
||||
|
|
@ -279,6 +279,39 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-005-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-005.xht">border-image-width-005</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent. In this test, the border image fills the content area, the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-006-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-006.xht">border-image-width-006</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the content area of an element is inexistent. In this test, the border image fills the padding area and 25px of the extended-beyond-border-belt area, 25px into the margin area of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="border-image-width-007-6.3" class="primary image">
|
||||
<td><strong>
|
||||
<a href="border-image-width-007.xht">border-image-width-007</a></strong></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>border image area - border-image-width
|
||||
<ul class="assert">
|
||||
<li>This test checks that the border image area can still exists even if the border area (or border belt) of an element is inexistent, even if the padding area (or padding belt) is inexistent and even if the content area is inexistent. In this test, the border image fills the margin area of the element. In this test, the whole border image area is outside the border box of the element.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s6.3.#auto0">
|
||||
<!-- 0 tests -->
|
||||
|
|
|
|||
|
|
@ -1472,6 +1472,30 @@
|
|||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-005" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-005.xht">border-image-width-005</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-006" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-006.xht">border-image-width-006</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-image-width-007" class="image">
|
||||
<tr>
|
||||
<td rowspan="1" title="border image area - border-image-width">
|
||||
<a href="border-image-width-007.xht">border-image-width-007</a></td>
|
||||
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="border-radius-001" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="Borders. border">
|
||||
|
|
|
|||
|
|
@ -180,6 +180,9 @@ border-image-slice-002.xht == reference/ref-filled-green-100px-square.xht
|
|||
border-image-slice-003.xht == reference/ref-if-there-is-no-red.xht
|
||||
border-image-slice-percentage.xht == reference/border-image-slice-percentage-ref.xht
|
||||
border-image-space-001.xht == reference/border-image-space-001-ref.xht
|
||||
border-image-width-005.xht == reference/ref-filled-green-100px-square.xht
|
||||
border-image-width-006.xht == reference/ref-filled-green-100px-square.xht
|
||||
border-image-width-007.xht == reference/ref-filled-green-100px-square.xht
|
||||
border-radius-001.xht == reference/border-radius-001-ref.xht
|
||||
border-radius-002.xht == reference/border-radius-002-ref.xht
|
||||
border-radius-003.xht == reference/border-radius-003-ref.xht
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
<tbody id="s6">
|
||||
<tr><th><a href="chapter-6.xht">Chapter 6 -
|
||||
Border Images</a></th>
|
||||
<td>(34 Tests)</td></tr>
|
||||
<td>(37 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s7">
|
||||
<tr><th><a href="chapter-7.xht">Chapter 7 -
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue