Data URIs
We're all familiar with traditional URI protocols like https, http, ftp, and file, but data URIs have become a large part of our online strategy. We can use them to display images, the Mac camera and webcams, and more. But what if we simply want to use a data URI to convey basic data?
Typing a data URI shouldn't be difficult, and it isn't. As someone that works on the Firefox DevTools Debugger, I'm often typing out data URIs to illustrate problems. The format is:
data:text/html,<body class="blah"></body>
We're all so ingrained to use protocol://subdomain.domain.tld addresses that data URIs look foreign...but they require the least amount of resources to express content!
![Create a Sheen Logo Effect with CSS]()
I was inspired when I first saw Addy Osmani's original ShineTime blog post. The hover sheen effect is simple but awesome. When I started my blog redesign, I really wanted to use a sheen effect with my logo. Using two HTML elements and...
![Creating Scrolling Parallax Effects with CSS]()
Introduction
For quite a long time now websites with the so called "parallax" effect have been really popular.
In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...
![WebKit-Specific Style: -webkit-appearance]()
I was recently scoping out the horrid source code of the Google homepage when I noticed the "Google Search" and "I'm Feeling Lucky" buttons had a style definition I hadn't seen before: -webkit-appearance. The value assigned to the style was "push-button." They are buttons so that...
![Vertically Centering with Flexbox]()
Vertically centering sibling child contents is a task we've long needed on the web but has always seemed way more difficult than it should be. We initially used tables to accomplish the task, then moved on to CSS and JavaScript tricks because table layout was horribly...
