Feb 24th 2008Claire PoultonCSS
You can automatically capitalize the text of your h1 – h6 tags in your code using the rule -
text-transform:capitalize;
How to Use This Rule
h1, h2, h3, h4, h5, h6
{text-transform:capitalize;}
(X)HTML
<h1>the first heading on my web page</h1>
Using the “text-transform” declaration will automatically capitalize the first letter of each word in your <h1> tag.
Feb 18th 2008Claire PoultonCSS
I have seen a LOT of people purporting that they know how to create websites with CSS. But, when I see style rules such as: img{border:none;}, I wonder where they learned CSS.
If you do NOT want a border on an element such as an image, the rule would be as follows:
img {border-style:none;}
Why “border-style” instead of “border”? Border is the short-hand for naming all border rules in one line – which consists of border-width, border-style, border-color – ie: border:1px solid #000;.
Another CSS Tip
Claire Poulton
Feb 18th 2008Claire PoultonCSS & HTML
Learn to write neat, easy to read Style Rules and HTML Code. You will save yourself a LOT of work and frustration by always doing things the same way every time and organize your Style Sheets. This is how I organize mine so if I need to edit or find some error, it’s way easier to work with:
Style Sheets:
By organizing your Style Sheets in this order ALL THE TIME, you create a pattern that you can follow for every website you design. Continue Reading »
Feb 18th 2008Claire PoultonCSS
This is HOW I got started using CSS to design my websites.
My very first website was green, red and white. I had hyperlinks on the pages that were the “default” bright blue. Being an aesthetic kind of person, that bright blue color looked gawd-awful. While I was surfing around the Internet I found some pages that had links on them, but, guess what? They were NOT bright blue. I had to find out how they did that.
I “viewed the source” and discovered some weird “style” stuff in the <head> of the web page. So, Continue Reading »
Feb 17th 2008Claire PoultonCSS
Let me ask you a question. How would you normally define the main elements of your website?
Like This?
<body bgcolor=”#FFFFFF” link=”#0000FF” vlink=”#800080″ alink=”#FF0000″ font face=”Arial, Helvetica, Sans Serif” size=”+2″ color=”#000000″>
OR – Like This:
<body>
The first example is the “old-fashioned” HTML – WYSIWYG way of defining how the main elements of the body will display on a web page.
The second example is how the HTML would appear if you “styled your body (tag)” in a Style Sheet.
OK – How does the browser know what to display, based on an opening <body> tag like that?
In the <head> of your document you add this: Continue Reading »
Feb 17th 2008Claire PoultonCSS & HTML
The worst way to create well-designed web pages is to use a WYSIWYG Editor. They may look like they’re doing the job, but what is happening is the code created by these monstrosities is almost unreadable and uneditable.
By creating NEAT organized Styles in a stylesheet, you have effectively removed about 75% of the junk out of your webpage. JUNK that will drive you nuts.
Some webmasters who create CSS Stylesheets, copy and paste code from a bunch of different websites because they don’t know how to create their own style rules. The result is a mish-mash of messy hard to read style rules.
There are 3 steps to good web page organization: Continue Reading »
Feb 16th 2008Claire PoultonCSS & HTML
You must use a proper “DOCTYPE” when creating Web Pages styled with CSS and (X)HTML.I have “Viewed the Source” of a LOT of web pages and find that most people don’t even use a proper DOCUMENT Type – Then they wonder why their pages look terrible.What does a “DOCTYPE” look like:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml“>
You don’t have to remember all that because when you use an editor such as Note Tab Lite the DOCTYPE is automatically generated for you.
Code It Right On Your Site!
Claire Poulton
