A virtual teacher who reveals to you the great secrets of Base64


The <style> tag is used to stylize page elements using the CSS language. Simply put, it tells the browser how the page should look. Unlike the <link> tag which loads external stylesheets, the <style> tag embeds CSS as source code of the HTML page. And this is the only difference, because it does not matter how styles are defined: externally, internally, or inline.

Good to know that some CSS properties support data URIs. Below I want to provide a simple example of how to embed a one-pixel red GIF within <style> contents and use it as <body> background.

  body {
    background: url("data:image/gif;base64,R0lGODdhAQABAPAAAP8AAAAAACwAAAAAAQABAAACAkQBADs");

For more information, please read How to embed Base64 encoded images in CSS.

Add new comment

If you have any questions, remarks, need help, or just like this page, please feel free to let me know by leaving a comment using the form bellow.
I will be happy to read every comment and, if necessary, I will do my best to respond as quickly as possible. Of course, spammers are welcome only as readers.