Week 1 - CSS Basics: Fonts and Colors

Homework Assignment:

• 1. Create your own rules for the BODY, H1, A and P selectors and save them in your mystyle.css style sheet. Link this style sheet to your HTML files (template.1html and template2.html).
• 2. Create a background image or use this one and add it to an HTML document using an external style sheet (create a new style sheet following the rules given for mystyle.css.) Use background-repeat and background-image to position your image on the page.

Both use the "mystyle" style sheet.

body {color: navy; background: gray url(bg56.jpg); 
background-attachment: fixed;}

P  {color: navy; font-family: Comic Sans, cursive, 
arial, verdana, sans-serif; font-size: medium;}

H1  {font-family: Comic Sans, cursive, arial, verdana, 
sans-serif; text-align: center; color: purple;}

H2  {font-family: Comic Sans, cursive, arial, verdana, 
sans-serif; text-align: center; color: purple;}

H3  {font-family: Comic Sans, cursive, arial, verdana, 
sans-serif; text-align: left; color: purple; font-weight: bold;}

TABLE  {font-family: times new roman, times, serif; width: 70%; 
text-align: center; color: green; background: silver; font-weight: bold;}

A  {font-size: medium; font-family: Comic Sans, cursive, 
arial, verdana, sans-serif; color: lime;}

li {text-transform: none; font-style: italic; 
font-family: Comic Sans, cursive, arial, verdana, sans-serif; 
text-align: left; text-indent: 50px; background: purple; color: silver;}

The first one uses the "mycss" style sheet.

body {background: #0D9A55 url(exposedfrog.jpg); 
background-repeat: no-repeat; 
background-position: 100px 100px;}

P  {color: navy; font-family: "Comic Sans", 
arial, cursive, verdana, sans-serif; 
font-size: medium;}

H1  {font-family: "Comic Sans", arial, cursive, 
verdana, sans-serif; text-align: center; 
color: purple;}

H3  {font-family: "Comic Sans", arial, cursive, 
verdana, sans-serif; text-align: left; 
color: purple; font-weight: bold;}

A  {font-size: medium; color: lime;}