Mr. Morton's ICT

CSS I

CSS Lesson 1
Click here for an online editor.
CSS is an update to HTML. It stands for cascading style sheet. HTML was never intended to contain tags for formatting a document.“When tags like <font>, and color attributes were added to the HTML 3.2 specification, it started a nightmare for web developers. Development of large web sites, where fonts and color information were added to every single page, became a long and expensive process. To solve this problem, the World Wide Web Consortium (W3C) created CSS. In HTML 4.0, all formatting could be removed from the HTML document, and stored in a separate CSS file. All browsers support CSS today.” (http://www.w3schools.com/css/css_intro.asp). Read more about CSS here.

CSS Syntax
A line of CSS code has two parts: the selector and the declaration(s):
external image EqS_Dh5DvP-KJ670fGdVL9JDohIX6UmsJhTzKeOlOsMdBMipYkjqthB3X1a8b_-DwYh5s1JQhycUES2gGRbSCAWbb4YFz5ra1LuvsFd-zTL2qnadN_U
The selector is the the HTML item that you wish to format (paragraph, heading, background). Declarations are the values or colors assigned to the selector. There can be multiple declarations for a single selector. You’ll always need the basic head shown below in blue:
<head>
<style type=”text/css”>
</style>
</head>

<p></p>

Now try this by copying this code into your editor:

<head>
<style type=”text/css”>
h1 {color:blue;}
p {margin-left:10px;}
</style>
</head>

<h1>This is the HEADING</h1><p>CSS!</p>
<p>This is going to make things much easier!!</p>

One Response

  1. never copy it always write it out yourself it helps you learn it and remember the format

    January 30, 2012 at 6:20 pm

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.