crop_rotate
Run
<!DOCTYPE html> <html> <head> <title>CloseTag</title> <style> #box { background-image:url('https://www.closetag.com/images/background.jpg'); background-repeat: no-repeat; background-origin:border-box; height:240px; width:304px; padding:30px; border:gray dashed 10px; } </style> </head> <body> <h1>CSS background origin padding box</h1> <p>Learn CSS background origin padding box</p> <div id="box"></div> </body> </html>
PCFET0NUWVBFIGh0bWw+DQo8aHRtbD4NCjxoZWFkPg0KPHRpdGxlPkNsb3NlVGFnPC90aXRsZT4NCjxzdHlsZT4NCg0KI2JveA0Kew0KICBiYWNrZ3JvdW5kLWltYWdlOnVybCgnaHR0cHM6Ly93d3cuY2xvc2V0YWcuY29tL2ltYWdlcy9iYWNrZ3JvdW5kLmpwZycpOw0KICBiYWNrZ3JvdW5kLXJlcGVhdDogbm8tcmVwZWF0Ow0KICBiYWNrZ3JvdW5kLW9yaWdpbjpib3JkZXItYm94Ow0KICBoZWlnaHQ6MjQwcHg7DQogIHdpZHRoOjMwNHB4Ow0KICBwYWRkaW5nOjMwcHg7DQogIGJvcmRlcjpncmF5IGRhc2hlZCAxMHB4Ow0KfQ0KPC9zdHlsZT4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+IDo6LXdlYmtpdC1zY3JvbGxiYXJ7d2lkdGg6N3B4O2hlaWdodDo3cHg7fTo6LXdlYmtpdC1zY3JvbGxiYXItdHJhY2t7YmFja2dyb3VuZDojZmZmO306Oi13ZWJraXQtc2Nyb2xsYmFyLXRodW1ie2JvcmRlci1yYWRpdXM6NXB4O2JhY2tncm91bmQ6IzJmNDVmZjt9PC9zdHlsZT48L2hlYWQ+DQo8Ym9keT4NCg0KPGgxPkNTUyBiYWNrZ3JvdW5kIG9yaWdpbiBwYWRkaW5nIGJveDwvaDE+DQo8cD5MZWFybiBDU1MgYmFja2dyb3VuZCBvcmlnaW4gcGFkZGluZyBib3g8L3A+DQo8ZGl2IGlkPSJib3giPjwvZGl2Pg0KDQo8L2JvZHk+DQo8L2h0bWw+