border-image-repeat-space-1-ref.html (2393B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Border Image: border-image-repeat: space</title> 6 <link rel="author" title="Ethan Lin" href="mailto:ethlin@mozilla.com"> 7 <link rel="author" title="Mozilla" href="https://www.mozilla.org"> 8 <style type="text/css"> 9 .outer { 10 width: 81px; 11 height: 81px; 12 } 13 .inner1 { 14 position: absolute; 15 top: 0px; 16 left: 0px; 17 width: 27px; 18 height: 27px; 19 background-image: url("support/border.png"); 20 } 21 .inner2 { 22 position: absolute; 23 top: 0px; 24 left: 31px; 25 width: 27px; 26 height: 27px; 27 background-image: url("support/border.png"); 28 background-position: -27px 0px; 29 } 30 .inner3 { 31 position: absolute; 32 top: 0px; 33 left: 62px; 34 width: 27px; 35 height: 27px; 36 background-image: url("support/border.png"); 37 } 38 .inner4 { 39 position: absolute; 40 top: 31px; 41 left: 0px; 42 width: 27px; 43 height: 27px; 44 background-image: url("support/border.png"); 45 background-position: 0px -27px; 46 } 47 .inner5 { 48 position: absolute; 49 top: 31px; 50 left: 62px; 51 width: 27px; 52 height: 27px; 53 background-image: url("support/border.png"); 54 background-position: -54px -27px; 55 } 56 .inner6 { 57 position: absolute; 58 top: 62px; 59 left: 0px; 60 width: 27px; 61 height: 27px; 62 background-image: url("support/border.png"); 63 } 64 .inner7 { 65 position: absolute; 66 top: 62px; 67 left: 31px; 68 width: 27px; 69 height: 27px; 70 background-image: url("support/border.png"); 71 background-position: -27px -54px; 72 } 73 .inner8 { 74 position: absolute; 75 top: 62px; 76 left: 62px; 77 width: 27px; 78 height: 27px; 79 background-image: url("support/border.png"); 80 } 81 </style> 82 </head> 83 <body> 84 <div class="outer"> 85 <div class="inner1"></div> 86 <div class="inner2"></div> 87 <div class="inner3"></div> 88 <div class="inner4"></div> 89 <div class="inner5"></div> 90 <div class="inner6"></div> 91 <div class="inner7"></div> 92 <div class="inner8"></div> 93 </div> 94 </body> 95 </html>