Presentation is loading. Please wait.

Presentation is loading. Please wait.

CSS The basics { }. CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html.

Similar presentations


Presentation on theme: "CSS The basics { }. CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html."— Presentation transcript:

1 CSS The basics { }

2 CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html file should look Cascading - sheets can apply formatting to: – all elements on a page – can single out a specific - i.e. paragraph- to have a different style

3 What’s the Difference? CSS can apply same formatting to – several HTML elements – without rewriting each line of code (e.g. style="color:red":) again and again CSS can apply appearance/ formatting to – several HTML pages – from a single CSS file

4 Where is CSS placed in html doc? Between here tags inside html file tags go inside of a webpage Example p { color: purple; } Result Purple text

5 Selector -any html element (i.e.,, or, but remove the <>s) Property - an aspect of a selector (i.e. to change the font-family, color, and font-size of the text on a web page) Value - a possible setting for a property (i.e. color can be red, blue, black, or almost any color; font-family can be any number of different fonts, etc.)

6 CSS Example: make a paragraph's text red with CSS: selector { property: value; } ____________________ p { color: red; }

7 Set multiple properties Example p { font-family: Garamond; color: green; font-size: 24px; }

8 Single Properties in multiple tags Example: Heading color red; paragraphs in Courier; span background in yellow h3 {color: red;} p {font-family: Courier;} span { background-color: yellow;}

9 Link html file to CSS file so html file can see/use the CSS file The link file placed between tag needs 3 attributes: 1st attribute - type="text/css" 2nd attribute - rel="stylesheet” 3rd attribute - href="web address of CSS file"/> Example blah

10 Hexidecimal Color Picker


Download ppt "CSS The basics { }. CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html."

Similar presentations


Ads by Google