Website Design and Development in Ipswich, Suffolk - Rubious

Archive for the ‘CSS Tips’ Category

CSS Quick Tips: print stylesheets

Wednesday, April 29th, 2009

A print stylesheet — a special stylesheet which formats your website for printing — can be utilised to hide unneeded parts (the site navigation) and save ink for your visitors (swap that white text on a black background for black text on a white background!).

Here are some tips for improving your print stylesheet.
(more…)

CSS Quick Tips: advanced selectors

Tuesday, April 28th, 2009

One of the many advantages of CSS is the ability to select parts of your web page based on a stylesheet, which means when adding content to a website you need not worry about how it is formatted. Headers will be the right size and font, links will be the colour specified. It is all taken care of and you don’t need a manual or reference guide on how to format a page (great for Content Management Systems!)

Advanced selectors can select specific parts of the page and alter them. For example, you can select the first letter of a new paragraph and make it big (for a drop cap) or select the all email links and format them a different way.

Some examples below.

(more…)

CSS Quick Tips: text-transform

Wednesday, January 28th, 2009

One of the great benefits of CSS is the ability to easily update or change the look of a whole website by only editing one file – the stylesheet. So whenever a heading is to be IN ALL CAPS, consider using the text-transform property.

h2 {
  text-transform: uppercase;
}
<h2>This header will be in all caps!</h2>

This allows you to write a header in the normal way, but have browsers interpret it as uppercase. Not only is this great for changing your mind later (you don’t have to re-write all those headings!) but it means your visitors can specify that they’d rather see headings in ’sentence case’ by use of a user style sheet