Home arrow Style Sheets arrow Customizing styles: User-Controlled Style Sheets - Part II

Customizing styles: User-Controlled Style Sheets - Part II

In this second article of a three-part series, you will learn how to allow visitors to your website to view an entirely different, more visually accessible style sheet from the "default" one. Normally, providing more than one style sheet causes browser conflict issues -- but with a little bit of JavaScript, we will solve this problem.

Author Info:
By: Alejandro Gervasio
Rating: 5 stars5 stars5 stars5 stars5 stars / 13
April 13, 2005
  1. · Customizing styles: User-Controlled Style Sheets - Part II
  2. · Changing entire style sheets: the first basic approach
  3. · Listing full source code
  4. · Summary and further reading

print this article

Customizing styles: User-Controlled Style Sheets - Part II
(Page 1 of 4 )


Welcome to Part II of the series "Customizing Styles: User-Controlled Style Sheets." If you read the first article, I really hope you had some fun playing with some of the techniques explained for changing styles in Web pages. Just in case you didn't have a chance to look at the first part, let's recapitulate the approaches I've demonstrated to perform simple and effective element's style manipulation.

Digging into the area of fascinating Web style programming, I've exposed the most common approaches for style changes in Web documents: accessing specific elements by their ID attribute, and more widely, manipulating larger page sections in a generic way, changing styles according to a given tag.

In the first case, the style change is a rather surgical process, where we need to affect only small document sections, and certainly intended to be used on a limited scale. The second method, which usually works on HTML collections generated from a targeted tag, such as a paragraph (p) element, is more flexible for giving users control over bigger portions of a Web page. From a designer's point of view, just using a simple script that manipulates programmatically multiple page elements at once, makes it a big time saver for style changes with a minimum of effort.

I'm pretty sure that you're very anxious to know about more complex techniques for manipulating styles. I hope I'm right. Of course, if you're a well-seasoned developer, this certainly won't blow your mind, but it might be useful for filling in some gaps in the overall background. So, with that in mind, the next step leads us directly to the process of changing entire style sheets. That's definitely a big step forward.  reading.

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-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials