InLine CSS -  Web 1.0 Site

What am I going to learn to do?

On this page,you will learn how to modify page elements and text with Inline CSS or Cascading Style Sheets.

What software/tools will I use?

Notepad

Web Browser

What are the ideas I will work with?

You can control parts of your page by modifying the tags.

If you don't modify the tags, they will behave normally

There are lots of modifications that you can do to these tags.

How do I do it?

Inline CSS - http://www.tizag.com/cssT/inline.php

Introduction to CSS - http://www.w3schools.com/css/css_intro.asp

How to write CSS code - http://www.w3schools.com/css/css_syntax.asp

Make a page called InLineCSS.html

There are three ways to use CSS on your pages, Inline, Embedded and External. Here we are going to work with Inline, where you control one tag at a time. With Embedded, you control many of the tags on a single page, and with External, you can control many of the tags on many pages. Anything that you don't specify in your CSS will not be affected. With Inline CSS, you will have to manually set each tag. As you go up in the controls, you can set it in one place and have it appear throughout a page or throughout a website.

Here is a P tag that is modified:

<p style="color:sienna;margin-left:20px">This is a paragraph.</p>

You can also control H tags, Divs and more.

Divs are neat, because you can make box shapes that you can then put information, pictures, text, links and more inside of.

To make a DIV, use the <DIV> and </Div> tag.

You can then put text that is controlled by H and P tags.

Control the size, location and color of the DIV with inline Style:

<DIV Style="background: black; color:yellow; margin-left:40px; margin-right:40px">Here is some text inside the DIV</DIV>

Write two paragraphs about an issue that is important to you in the community. Explain what the issue is in the first paragraph, and explain what you wish could be done about it in the second paragraph. Each paragraph should be at least five sentences long.  Use <P> and </P> tags for the paragraphs. Use H tags for the headings of the paragraphs. Place each paragraph and headline into its own DIV.

Modify the Divs,  P tags and the H tags with inline CSS 

Checklist

• HTML page structure
• Title with page name and your name (first name and last initial only )
• Heading with page name and your name (first name and last initial only
• Proper use of WhiteSpace in your HTML code
• Two paragraphs, each with its own heading
• Each paragraph is placed into a DIV
• Paragraphs, headings and DIVs are all controlled by Inline Style.