OLD | NEW |
---|---|
(Empty) | |
1 <!doctype html> | |
2 <html> | |
3 <head> | |
4 <style type="text/css"> | |
5 .test-class { | |
6 margin: 50px auto; | |
7 background-image: url(data:image/svg+xml;base64, PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2Jl IElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAg QnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4i ICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHZl cnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIg eG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJ IHdpZHRoPSI0MHB4IiBoZWlnaHQ9IjQwcHgiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZW5hYmxlLWJhY2tn cm91bmQ9Im5ldyAwIDAgNDAgNDAiIHhtbDpzcGFjZT0icHJlc2VydmUiIG92ZXJmbG93PSJoaWRkZW4i Pgo8bGluZWFyR3JhZGllbnQgaWQ9IlNWR0lEXzFfIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVz ZSIgeDE9IjUuODU3OSIgeTE9IjUuODU3OSIgeDI9IjM0LjE0MjEiIHkyPSIzNC4xNDIxIiBncmFkaWVu dFRyYW5zZm9ybT0ibWF0cml4KDAuNzA3MSAwLjcwNzEgLTAuNzA3MSAwLjcwNzEgMjAgLTguMjg0Myki PgoJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6IzAwQTk5NSIvPgoJPHN0b3AgIG9m ZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6IzNDMzc5NSIvPgoJPHN0b3AgIG9mZnNldD0iMC41MDU2 IiBzdHlsZT0ic3RvcC1jb2xvcjojQTUzNTk0Ii8+Cgk8c3RvcCAgb2Zmc2V0PSIxIiBzdHlsZT0ic3Rv cC1jb2xvcjojREEyMTI4Ii8+CjwvbGluZWFyR3JhZGllbnQ+Cjxwb2x5Z29uIGZpbGw9InVybCgjU1ZH SURfMV8pIiBwb2ludHM9IjIwLDQwIDAsMjAgMjAsMCA0MCwyMCAiLz4KPC9zdmc+Cg==); | |
fs
2014/05/09 12:18:28
Nit: It's non-obvious how this data-URI differs fr
| |
8 background-size: contain; | |
9 } | |
10 </style> | |
11 </head> | |
12 <body> | |
13 <div style="width: 100%;"> | |
14 <div class="test-class" style="width:60px; height:60px;" > | |
15 </div> | |
16 <div class="test-class" style="width:40px; height:40px;" > | |
17 </div> | |
18 <div class="test-class" style="width:28px; height:28px;" > | |
19 </div> | |
20 </div> | |
21 </body> | |
22 </html> | |
OLD | NEW |