background-clip-001.html (1958B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Backgrounds and Borders Test: background-clip - initial and supported values</title> 5 <link rel="author" title="Intel" href="http://www.intel.com" /> 6 <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-clip" /> 7 <meta name="flags" content="dom" /> 8 <meta name="assert" content="Check if background-clip initial value is border-box and supports values border-box, padding-box and content-box" /> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 </head> 12 <body> 13 <div id="log"></div> 14 <div id="test"></div> 15 <script> 16 test(function() { 17 assert_equals(getComputedStyle(document.getElementById("test"), null).getPropertyValue("background-clip"), 18 "border-box", "background-clip initial value"); 19 }, "background-clip_initial"); 20 21 document.getElementById("test").style.backgroundClip = "border-box"; 22 test(function() { 23 assert_equals(getComputedStyle(document.getElementById("test"), null).getPropertyValue("background-clip"), 24 "border-box", "background-clip supporting value"); 25 }, "background-clip_border-box"); 26 27 document.getElementById("test").style.backgroundClip = "padding-box"; 28 test(function() { 29 assert_equals(getComputedStyle(document.getElementById("test"), null).getPropertyValue("background-clip"), 30 "padding-box", "background-clip supporting value"); 31 }, "background-clip_padding-box"); 32 33 document.getElementById("test").style.backgroundClip = "content-box"; 34 test(function() { 35 assert_equals(getComputedStyle(document.getElementById("test"), null).getPropertyValue("background-clip"), 36 "content-box", "background-clip supporting value"); 37 }, "background-clip_content-box"); 38 </script> 39 </body> 40 </html>