Css

MAKES OUR WEBSITE LOOK LIKE A WEBSITE

CSS

CSS (Cascading Style Sheets)

Describes the presentation of your HTML document.

Our CSS code belongs in a separate document.

Do do not work with CSS in our HTML document.

.HTML .CSS

Why do we need CSS?

To organize our website. Tells our HTML where to go AND what to look like.

We can make and design comment boxesWe can change the background and color of

our font.We can add margins and create a navigation

bar.Makes our website look like a website

1st thing’s 1st

We need to connect our HTML document to our CSS document

This is very easy, we start by opening our HTML document.

Inside your <head> tag is where we will write the code linking our HTML document to our CSS document.

The code

<link rel="stylesheet" type="text/css" href="style.css">

Linking a style sheetGiving it a type Telling Komodo where to find our CSS

document.

What your code should look like

<!DOCTYPE html><html><head><title>Your Website</title><link rel="stylesheet" type="text/css"

href="style.css"></head>

So what does CSS code look like?

CSS needs to know what it’s editing. You can edit every part of your website

individually if you just tell CSS what you want to change.

Example…Lets change the font color of our Header

<h1>

Changing Font Color

We know what we want to change is in-between the <h1> and </h1> tags

Tell CSS this by inputting this code

h1{Font-color:blue;}

What did we just do?h1{Font-color:blue;}Selected our the header by typing h1We start the command with a {We insert the command after, Font-ColorWe place a semi colon : after the

command then we give it a value.To end our CSS code we need 2 things.Semi colon after the value ; and a

closing } to end the code

CSS isn’t that difficult.

You need to practice and CSS will become easier.

We find what we want to edit.We tell CSS how we want to edit it.

Education

Css