Best Viewed: Safari on iOS, Mac OS X, Windows
Concert Poster
You can use CSS to improve your web pages in a number of ways. For example, you can reduce the number of remote resource requests and the overall size of your web page by using CSS to draw styled text, borders, reflections, and gradients. And, when you use CSS web fonts instead of images to display text in non-standard fonts, your text is automatically selectable, scalable, accessible to screen readers, and indexable by search engines. Using CSS instead of images to create advanced effects can minimize memory footprint, reduce overall download time, and improve accessibility.
In this example:
- A custom font is displayed with the
@font-facerule. - The frame is drawn with a single image and
-webkit-border-image. - The glass overlay is drawn with
-webkit-gradient, then masked with HTML5<canvas>using-webkit-mask.
