Styling Web Page Headers with Transparent Background Images
(Page 1 of 4 )
Welcome to the last installment of the series “Building Corner Effects with Transparent Background Images.” This series, which is comprised of three parts, guides you through the process of building rounded and angled corners, in addition to creating other appealing effects, which can be easily applied to one of more elements of a web page to improve its overall visual presentation.
Indeed, the utilization of some basic transparent background images is one of the simplest approaches that can be implemented these days with the objective of achieving true eye-catching corner effects on the different elements of a given web page. Actually, this technique is popular with seasoned web designers, but if you’re just starting to dive into the huge and deep waters of professional web development, you might want to learn the core concepts for mastering this method.
Now that you’re familiar with the primary objective of this series, let me quickly refresh the concepts deployed in the preceding article, in this manner establishing an appropriate continuity between that tutorial and the current one. Well, as you’ll certainly recall, during the course of the second installment of the series, I offered a friendly introduction to building some basic angled corners by using a combination of a few simple CSS styles and a unique transparent background image.
As you learned previously, this approach offers remarkable versatility for building not only the aforementioned angled corners, but for creating similar effects, like the popular rounded corners and many others that can be easily attached to several elements of a specific web page.
And speaking of the great versatility offered by this approach, in this final article of the series I’ll show you how to build quickly, and with minor effort, some fancy web page headers by using the functionality provided by a few simple transparent background graphics.
Hopefully, by the time you finish reading this tutorial, you will be equipped with the required background to start using this approach for incorporating all sorts of appealing corner effects into your own web sites.
So, are you ready to learn how to use transparent background images to style the respective headers of a web page? Let’s get started now!
Next: Review: building angled corners using a transparent background image >>
More Style Sheets Articles
More By Alejandro Gervasio
