Image as CSS instead of URL resource unsing Base64 encoding

on
This is the probably best approach to use image as CSS instead of resource file.

There are a lot of websites who can convert the image to base64 text. One such website URL given below.

https://www.base64-image.de/

simple usage given below:

<html>
<body>
<table>
<tr>
<td class="sf">
</td>
</tr>
</table>
</body>
<style>
td.sf{
cursor: pointer;
background-repeat: no-repeat;
background-position: center center;
background-image: url('data:image/false;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABACAYAAACjgtGkAAAABHNCSVQICAgIfAhkiAAAAAFzUkdCAK7OHOkAAAAEZ0FNQQAAsY8L/GEFAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAuBJREFUeF7tmL1vEzEUwJ3QCBUooohA6FbBwFwQExtihgHBgBAL/BsM/B1ICAkkJoQYWFlh6QxiRW1FgoRggCpAuXfxC86Ln+M734cv937S6Wyf7dg/f8R3nYMEJUzp6rugESEEEUIQIQQRQhAhBBFCECEEEUIQIYRcR/fLr4ZqezTWMTs3N1fVi6vrOtYcMglZebyjQ/50kmt8f2MSIWw831Nffv7VsVl+M2XKxltIHhkmZgez1FW1GC8hoTIQ6Fyeus4fX1Efbp3WsXJZKKQoGUVQxWxxColJBoBCXO0KldYoIVnJI4cV0nQZJlnEtOJglmVwW3NS9ZViFbJMy8XEp1+te5d5u7OvQ3ZaJ+Tam686ZKd1QgDX0rEKCTnchB6MoHxoHSFENUNABIxenZv6nJArr0dL+y/jw9xJlZNhTmPMw6XZngNcuY/Jm+y55I0WgTSf31s/3FXDuwOdwpfjoO0DZoRwFUBBn8qxQZjXFv5276w61uvM1ceVAzAO98GzPTX6NfmoZMsHcPVQML/JdMm4CmJj4Pp0+4xOnVSIF+Xh1lp6p89PPN1N71y5RaAMF3nrBrw3VZAC1+baoTSOP4jplEfbP9I7PjfzmPG8DefYejm0/qYv0yXjKkwbzXUG0iFt0XMTMy+GATPf/p8DdfTJrjMP4KqfQvMhqZCTyTT+PmY/i5TOxVM99f5Gn218GXBC0iVTpwygahkuaj+YcSNVF+mSiWV0qsI1COkMiW2UyuTd9b4O2al9yVTNpX5Ph+y0SojPSpgKWfZl49u/VsyQLIPt/bbbRPLM+jkhQJOlhC59qxAgZill7nesECQ2MWXKABYKMalbTtkygExCKFUIGqx21ec7/z8Tlk00QqoYfR+CziFFdSIWGUDwwSy0MzHJAAo5qUKnHlw4omP+xCYDCNpDbPjsKzGKQAoX0nRa8XKXBRFCECEEEUIQIQQRQhAhBBFCECEEETKDUv8AoluCvQbFK1kAAAAASUVORK5CYII=');
}
</style>
</html>
view raw imageCSS.htm hosted with ❤ by GitHub


Comments

Post a Comment