Jump to content


- - - - -

CSS Syntax


  • You cannot reply to this topic
No replies to this topic

#1 Joe

    Root Administrator

  • EC-Owner
  • PipPipPipPipPipPipPipPip
  • 393 posts

Posted 12 January 2008 - 07:57 PM

Syntax



Like all scripting languages CSS has a syntax or a specified way of taking in information. The order of CSS is this:
 selector {property: value;}
This specifies where the info you are trying to receive in order to define a variable is taken from. One note that you should know is that CSS is not case sensitive, however other things inside of them such as font families or an id tag may be. An example of CSS syntax would be:

HTML:
<body>
<p class="limebold">Today I'm learning what the body is</p>
</body>


CSS:
p.limebold {color: #00ff00; font-weight: bold;}


This would cause the HTML to find the "p" or paragraph with a class (.limebold) specified above and then it would apply the CSS attributes to that HTML inside of those tags. The same works for "ID's". If I use the following HTML:

<body>
<p id="limebold">Today I'm learning what the body is</p>
</body>


Then the CSS would have to be:
p#limebold {color:#00ff00; font-weight:bold;}


Some universal CSS tags include: "<body>", "<p>", "<h1>,<h2>,<h3>,<h4>,<h5>". While you are not limited to these tags, meaning you can create your own as well, they are default for many sites and taught internationally.

The Body is used to describe all text and background for the website itself that is not included in any tags. "<p>" tag is the paragraph tag which starts a new paragraph and uses "<body>" CSS as default unless specified otherwise. H1-H5 are headings and as the number increases the font-size decreases(by default, making h1 the largest and h5 the smallest).

Some notes when creating CSS syntax:

If you start a Class or ID with a number it will not work in Firefox

If you wish to insert a comment into the code that does not show up in a browser use

 /* This is a comment */


When you finish adding a value to a property you must always add ";" after the value to show that you are moving on to a new property.






1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users