cascading style sheets and the world wide web consortium module 1: html basics lesson 3

7
Cascading Style Cascading Style Sheets and the Sheets and the World Wide Web World Wide Web Consortium Consortium Module 1: HTML Basics LESSON 3 LESSON 3

Upload: spencer-osborne

Post on 18-Jan-2018

217 views

Category:

Documents


0 download

DESCRIPTION

Module 1: HTML Basics LESSON 3 Using Cascading Style Sheets Adds flexibility to Web pages. Works in tandem with HTML. Allows the formatting of pages to be easily changed. Uses selectors { property1: value; property2: value; }

TRANSCRIPT

Page 1: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Cascading Style Sheets Cascading Style Sheets and the World Wide Web and the World Wide Web ConsortiumConsortium

Module 1: HTML Basics

LESSON 3LESSON 3

Page 2: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Module 1: HTML Basics

LESSON 3LESSON 3

Web Page Structure HTML is a publishing language for the Internet

H Hyper T Text M Markup L Language

Page 3: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Module 1: HTML Basics

LESSON 3LESSON 3

Using Cascading Style Sheets• Adds flexibility to Web pages.• Works in tandem with HTML.• Allows the formatting of pages to be easily changed.• Uses selectors { property1: value; property2: value; }

Page 4: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Module 1: HTML Basics

LESSON 3LESSON 3

Cascading Style Sheets Study the following HTML document. In the following slides, it will be

rendered using two different style sheets.

<html><head><title>Using CSS</title><link rel="stylesheet" type="text/css" href="myNewStyle.css" />

</head><body>

<h1>Jack</h1><h2>Jack be nimble<br></h2>Bat, bat, come under my hat,<br>And I'll give you a slice of bacon;<br>

<ol>Twelve days of Christmas<li>partridge in a pear tree.<li>Turtle Doves

</ol>

Page 5: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Module 1: HTML Basics

LESSON 3LESSON 3

Cascading Style Sheets (CSS)Using this CSS Renders

body { font-family: "Times New Roman" ;

font-size: 1.5em;color: #777700;

• }

h1 { font-size:3em;color: red;

}h2 {

font-size: 2.5em;color: #FFFF00;

}li {

font-style: oblique; }

Page 6: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Module 1: HTML Basics

LESSON 3LESSON 3

Who Owns the Web?

No one Everyone World Wide Web Consortium (W3C) sets the standards Tim Berners-Lee (W3C Director and inventor of the

World Wide Web)

Page 7: Cascading Style Sheets and the World Wide Web Consortium Module 1: HTML Basics LESSON 3

Module 1: HTML Basics

LESSON 3LESSON 3

Lesson Review Why do professionals use CSS? What kinds of things can be affected by CSS? What is a selector? Describe its syntax. What is W3C? What is the role of W3C?