Presentation is loading. Please wait.

Presentation is loading. Please wait.

XHTML Formatting font with a style declaration. Formatting Font HTML uses the font tag to change size and family of font But… the font tag is being deprecated.

Similar presentations


Presentation on theme: "XHTML Formatting font with a style declaration. Formatting Font HTML uses the font tag to change size and family of font But… the font tag is being deprecated."— Presentation transcript:

1 XHTML Formatting font with a style declaration

2 Formatting Font HTML uses the font tag to change size and family of font But… the font tag is being deprecated – meaning it is being phased out The W3C is encouraging the use of style sheets instead One part of Cascading Style Sheets (CSS) is the style attribute

3 Formatting Font XHTML specifies the structure of a document, CSS specifies the style of the display The style attribute can be placed in almost any tag. It has many values, we will learn font-size, font-family, and color.

4 Style Attribute The value for style consists of style declarations, which are: A property followed by a colon : font-family: color: And then a value followed by a semicolon ; font-family: arial; color: #ff3399;

5 Font-Size Property Property: font-size: Specifies the size of the font. Value Use pixels Or, percentage of the surrounding text

6 Font-Size Property Examples: This is smaller text This is smaller text. This paragraph is 14 pixels

7 Font-Family Property font-family: Specifies the style of the font that will be used. If the computer does not have the font you specify, it will use a default. You may indicate more than one family- just separate them with a comma If the first font is not found on the computer, the next one will be used. Generic: serif and sans-serif

8 Font-Family Property Examples: Style in the body tag changes font for the entire web page

9 Font-Family Property This power point is Verdana Times New Roman font

10 Color Property color: Specifies the color of the font. Colors are represented in #RRGGBB numbers (There are some color names, but they may not be understood by all browsers) This is a red heading

11 Color on the Web - RGB Monitors create images on the screen by emitting red, green, and blue light – RGB color. These lights are emitted in varying intensities, giving different colors. Hexadecimal code indicates the intensity of each color. 00-ff for each color #00FF00 is green

12 Style Attributes and Values May combine the declarations where size is the size of words family is the style of words (font type) color is the color of words

13 Where to place styles Several Paragraphs that use the same style rule: text…. some heading another paragraph… All paragraph and heading text in div element will have red text

14 Where to place styles Changing one word, phrase or sentence use span element Here, one word will be red. Here, one word will be red

15 Summary – Where to add your styles Entire Page - Heading Several Paragraphs Single Paragraph Less than a paragraph

16 Assignment Open index.htm in Sun_Sand folder Change the body tag: Change the h1 tag: Sun &… Add the same color style to What you’ll find here: Then do guided practice on Using Styles


Download ppt "XHTML Formatting font with a style declaration. Formatting Font HTML uses the font tag to change size and family of font But… the font tag is being deprecated."

Similar presentations


Ads by Google