mirror of
https://github.com/servo/servo.git
synced 2025-08-03 12:40:06 +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 -
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue