css3-background-origin-padding-box.html (1038B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <title>CSS Backgrounds Test:background origin property with value padding-box</title> 6 <link rel="author" title="yanshasha" href="mailto:yanshasha133@gmail.com" /> 7 <link rel="reviewer" title="Dayang Shen" href="mailto:shendayang@baidu.com" /> <!-- 2013-08-26 --> 8 <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-origin" /> 9 <link rel="match" href="reference/css3-background-origin-padding-box-ref.html" /> 10 <style type="text/css"> 11 div { 12 width: 100px; 13 height: 100px; 14 border: 12px dashed black; 15 padding: 20px; 16 background-image: url('support/green-60-60.png'); 17 background-repeat: no-repeat; 18 background-origin: padding-box; 19 } 20 </style> 21 </head> 22 <body> 23 <p> 24 The test passes if the green square is just close to the dashed border. 25 </p> 26 <div></div> 27 </body> 28 </html>