Home arrow Style Sheets arrow Template Presets for the Yahoo Grid CSS

Template Presets for the Yahoo Grid CSS

If you're looking for a fast way to set up a professional-looking web site, this series of articles may be just what you need. It shows you how to use Yahoo Grid CSS, a CSS library that will help you build web pages quickly.

Author Info:
By: Alejandro Gervasio
Rating: 4 stars4 stars4 stars4 stars4 stars / 7
August 22, 2007
  1. · Template Presets for the Yahoo Grid CSS
  2. · Using customized web page templates with the Yahoo Grid CSS framework
  3. · Building web pages with custom widths
  4. · Introducing the concept of web page presets

print this article

Template Presets for the Yahoo Grid CSS
(Page 1 of 4 )


The term "framework" has became extremely popular with web designers and developers these days. Indeed, there is a noticeable proliferation of pre-built software libraries that allow users to quickly tackle the most common tasks associated with the disciplines covered by the vast area of web development.

Based upon the "framework" concept, Yahoo has recently released a library which will let you build both simple and complex web page layouts in a very short time. If you're interested in learning how to put this CSS package to work for you, then you'll want to start reading this series of articles now.

Welcome to the second part of the series that began with "Using Yahoo Grid CSS." As stated earlier, this series steps you through using the most relevant features provided by this CSS library, and complements all of the theoretical concepts with several illustrative hands-on examples.

If you already read the previous article of the series, building basic web page layouts using the wealth of predefined templates bundled with this Yahoo library is now a familiar process to you. As you'll recall, in that tutorial I demonstrated how to create some primitive web documents by using the set of basic templates packaged with the framework. In doing so, it was possible to build a few primitive web pages that used the pre-built "doc," "doc2" and "doc3" templates provided by the CSS package.

However, the Yahoo Grid CSS framework not only provides web designers with the capacity for creating basic web page layouts using the built-in templates that you learned in the previous tutorial, but it allows users to define customized templates. Additionally, the CSS library incorporates some useful web document layout presets for easily building two and three-column web pages, or even more complex combinations.

In this part of the series I'll be taking a close look at these features and capabilities, so you can grasp quickly how to put them to work.

All right, with the preliminaries out of the way, let's continue exploring the capacities of the Yahoo Grid CSS framework. Let's get started!

blog comments powered by Disqus

- CSS Padding Overview
- CSS: Margins Overview
- Top CSS3 Button Tutorials
- More Top CSS3 Tutorials for Animation and Im...
- CSS Mega Menus: Adding Extra Sections
- CSS Mega Menus
- CSS3 Accordian Menu: Horizontally Display Hy...
- CSS Combinators: Working with Child Combinat...
- CSS Combinators: Using General Siblings
- Intro to CSS Combinators
- CSS Semicircles and Web Page Headers
- Drawing Circular Shapes with CSS3 and Border...
- More CSS Pagination Link Templates
- CSS Pagination Links
- Animated CSS3 Image Gallery: Advanced Transi...

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials