| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <title>Test of CSS3 background-position 4 values</title> | 4 <title>Test of CSS3 background-position 4 values</title> |
| 5 <style> | 5 <style> |
| 6 div { width: 100px; height: 100px; background-repeat: no-repeat; background-
image: url("./resources/diamond.png"); } | 6 div { width: 100px; height: 100px; background-repeat: no-repeat; background-
image: url("./resources/diamond.png"); } |
| 7 #one { background-position: left 10px top 15px;} | 7 #one { background-position: left 10px top 15px;} |
| 8 #two { background-position: right 10px bottom 10px; } | 8 #two { background-position: right 10px bottom 10px; } |
| 9 #three { background-position: left top; } | 9 #three { background-position: left top; } |
| 10 #four { background-position: 10px 15px; } | 10 #four { background-position: 10px 15px; } |
| 11 #five { background-position: left 15px; } | 11 #five { background-position: left 15px; } |
| 12 #six { background-position: 10px top; } | 12 #six { background-position: 10px top; } |
| 13 #seven { background-position: right top 15px; } | 13 #seven { background-position: right top 15px; } |
| 14 #eight { background-position: left 10px center; } | 14 #eight { background-position: left 10px center; } |
| 15 #nine { background-position: center top 20px; } | 15 #nine { background-position: center top 20px; } |
| 16 #ten { background-position: top 20px center; } | 16 #ten { background-position: top 20px center; } |
| 17 #eleven { background-position: center left 30px; } | 17 #eleven { background-position: center left 30px; } |
| 18 #twelve { background-position: left 20px top; } | 18 #twelve { background-position: left 20px top; } |
| 19 | 19 |
| 20 #thirteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: center, left bottom 20px; } | 20 #thirteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: center, left bottom 20px; } |
| 21 #fourteen { background-repeat: no-repeat, no-repeat; background-image: url("
./resources/diamond.png"), url("./resources/ring.png"); background-position: rig
ht 20px bottom 20px, center left; } | 21 #fourteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: right 20px bottom 20px, center left; } |
| 22 #fifteen { background-image: url("./resources/diamond.png"), url("./resource
s/ring.png"); background-position: left 10px top 15px, right 20px bottom 20px; } | 22 #fifteen { background-image: url("./resources/diamond.png"), url("./resource
s/ring.png"); background-position: left 10px top 15px, right 20px bottom 20px; } |
| 23 #sixteen { background-image: url("./resources/diamond.png"), url("./resource
s/ring.png"); background-position: left 10px top, top 10px right; } | 23 #sixteen { background-image: url("./resources/diamond.png"), url("./resource
s/ring.png"); background-position: left 10px top, top 10px right; } |
| 24 #seventeen { background-image: url("./resources/diamond.png"), url("./resour
ces/ring.png"); background-position: right top 15px, bottom right 20px; } | 24 #seventeen { background-image: url("./resources/diamond.png"), url("./resour
ces/ring.png"); background-position: right top 15px, bottom right 20px; } |
| 25 #eighteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: center, center; } | 25 #eighteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: center, center; } |
| 26 #nineteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: center, center right; } | 26 #nineteen { background-image: url("./resources/diamond.png"), url("./resourc
es/ring.png"); background-position: center, center right; } |
| 27 #twenty { background-image: url("./resources/diamond.png"), url("./resources
/ring.png"); background-position: left 30px center, center bottom; } | 27 #twenty { background-image: url("./resources/diamond.png"), url("./resources
/ring.png"); background-position: left 30px center, center bottom; } |
| 28 </style> | 28 </style> |
| 29 </head> | 29 </head> |
| 30 <body> | 30 <body> |
| 31 <table border cellspacing="0" cellpadding="0"> | 31 <table border cellspacing="0" cellpadding="0"> |
| (...skipping 22 matching lines...) Expand all Loading... |
| 54 <td><div id="sixteen"></div></td> | 54 <td><div id="sixteen"></div></td> |
| 55 <td><div id="seventeen"></div></td> | 55 <td><div id="seventeen"></div></td> |
| 56 <td><div id="eighteen"></div></td> | 56 <td><div id="eighteen"></div></td> |
| 57 <td><div id="nineteen"></div></td> | 57 <td><div id="nineteen"></div></td> |
| 58 <td><div id="twenty"></div></td> | 58 <td><div id="twenty"></div></td> |
| 59 </tr> | 59 </tr> |
| 60 </table> | 60 </table> |
| 61 </body> | 61 </body> |
| 62 </body> | 62 </body> |
| 63 </html> | 63 </html> |
| OLD | NEW |