(redirected from UserStyleSheet)

UserStyleSheets

MeatballWiki | RecentChanges | Random Page | Indices | Categories

UserStyleSheets are CascadingStyleSheets where you define the defaults. You can do things like eliminate deprecated tags from your markup. O'Reillynet has an article called [Tap the Power of User Style Sheets] which covers the joy and wonder of this. InternetExplorer can do it sort-of in a way, but the MozillaBrowser, with far better CSS2 support, allows you to do much more with it. I have it set to eliminate the font tag and to not display banner-ad-sized images.

There's a spin-off of this article, written by Eric Meyer and aptly titled [The CSS Anarchist's Cookbook]. I [translated] it into German, but that's not the reason why I mention it: The article basically shows that design on the web sometimes depends much more on the user than the author. It's an eye-opener for all those designers from the "pixel-perfect absolute control" school of thought. --MatthiasGutfeldt?

Those articles are rather outdated... though the CSS still works. Instead of looking for a user.css file like the article suggest, put your User StyleSheet? in the userContent.css file, in your Chrome directory. Finding the Chrome directory can be difficult... Start your search here: C:\Windows\Application data\Mozilla\profiles then click on a profile folder (each folder is used by a profile you created with the Mozilla profile manager), then click on that folder with the funny name (it should be the only folder in this directory, and have a name like "1wua329v.slt"). Then click on the folder named "chrome", then open the "userContent.css" file. Put your CSS in this file! Also, try blocking ads based on their alternate text! e.g:

IMG[alt="Advertisement"] { display: none !important; }

Unfortunately, the alt="" is case sensitive. So you'll have to do stuff like:

IMG[alt="ADVERTISEMENT"], IMG[alt="Advertisement"], IMG[alt="advertisement"] { display: none !important; }

If anyone knows a way around this, it would be very helpful.

A useful sample userContent.css file can be found at http://kmself.home.netcom.com/Download/userContent.css

Examples of a page with and without the stylesheet in place are at:

Wiki Examples

Since the user style sheet applies to all sites, it can be difficult to selectively change the appearance of sites.

OddMuse puts the visited URL into the body class attribute, therefore you can put something like the following in your user style sheet:

    body[class="http://www.emacswiki.org/cgi-bin/emacs.pl"] { background-color: #DDD !important; color: #000 !important; }
    body[class="http://www.emacswiki.org/cgi-bin/emacs.pl"] * { background: inherit !important; color: inherit !important; }
    body[class="http://www.emacswiki.org/cgi-bin/emacs.pl"] a { color:#00F !important; }
    body[class="http://www.emacswiki.org/cgi-bin/emacs.pl"] a:visited { color:#A0A !important; }
    body[class="http://www.emacswiki.org/cgi-bin/emacs.pl"] img.logo { border-style:solid !important; }

Using this, you can now visit the site with [1] and without [2] these settings in effect.

(redirected from UserStyleSheet)

UserStyleSheets

Wiki Examples

Discussion