Clases de embargo de acuerdo al Código Fiscal

} .smaller{

font-size: .65em;

}

This is how the above CSS code styling will look in a browser. Notice the overline on the footer and the centered header.

FIGURE 2 - 9

76

1. What attribute would you use if you wanted to underline your text?

a. text-align: underline b. text-align: justify c. text-decoration: blink d. text-decoration: underline

2. What attribute would you use if you wanted to decorate your text with an overline?

a. text-align: underline b. text-align: justify c. text-decoration: blink d. text-decoration: overline

3. What attribute would you use if you wanted to indent your text by 50 pixels?

a. text-indent: 40px b. text- indent: 50px c. text- indent: 50pt d. text- indent: 50em

4. Identify the function, purpose and, if appropriate, the output produced by each code fragment. Write your answers in the space provided.

4.1. color: rgb(10,50,100);

4.2. font-family: arial, verdana, sans-serif;

4.3. text-decoration: overline;

2.5 Text Alignment, Decoration, Indentation, and Text Transformation

Questions for Review

4.4. font-size: .65em;

4.5. text-transform: uppercase;

78

C

2 l

e

Create a basic HTML document. Use markup tags and div elements.

Style the document using the techniques introduced in the text.

Create a correct and standard-compliant XHTML basic document structure. Inside the <title> element place the text Lab 2: Text.

Within the body element create two <div> elements (opening and closing tags). In the first element, put an appropriate header element that contains the text content “Places I’d like to visit.” In the second <div>

element, place an appropriate header element that contains the text content “Foods I like to eat.”

Under each of the header elements, create a list of places you’d like to visit and foods you like to eat using <p> tags, <br/> tags and other markup tags as appropriate.

Create a <style> element. Make sure to use the appropriate attribute/

value pair with your <style> tag to ensure that browsers recognize your stylesheet correctly.

Style your heading tags as follows:

Font: Georgia Font Size: 16pt

Color: Red 215 | Green 0 | Blue 0

Style the text in the lists below the heading tags as follows:

Font: Arial

Font Size: 80% of the default style sheet (Use ems) Color: #0000AB

Using the correct CSS rule, center-align your heading tags and make them all capital letters (Don’t change the text content of the elements.)

Final Lab Exercises

C

2 s

In this chapter, we discussed how to use HTML text markup.

You learned various methods for altering text using HTML. We also reviewed the new tags that will be available in HTML5. You discovered how to use <div> and <span> tags as well.

This chapter also gave an introduction and overview of using CSS to style your HTML. We discussed the three methods for implementing CSS in your HTML and which method was appropriate depending on the situation. We also reviewed several attributes for styling text, including attributes for changing the color and font. In future chapters, we will go into greater detail on how to use CSS to make your websites look neat and professional.

In the following chapter, we will discuss how to organize your text using lists. You will learn how to create ordered and unordered lists and style your lists using CSS

l

T

, s

T

i

Tag, Style or

Terminology

Definition

Text markup A general term describing the HTML elements integrated into content.

<h1> A first level HTML heading.

<h2> A second level HTML heading.

<h3> A third level HTML heading.

<em> A tag that denotes emphasized text.

<strong> A tag that denotes strong text.

<span> A tag that is used to denote a portion of inline text for formatting with CSS.

<div> A tag that divides a block-level section of text.

80 Inline tag A category of tags that don’t create a new line but

simply run continuously with the text block.

<header> An HTML5 tag meant to section off text as the header of the document.

<footer> An HTML5 tag meant to section off text as the footer of the document.

<aside> An HTML5 tag meant to place some text aside from the main article. Usually this is used for content that is ancillary.

<nav> An HTML5 tag meant to section text and/

or images as the navigation element of the document. Frequently the menu bar would be stored within a <nav> element.

<article> An HTML5 tag meant to section off text as an article within the document. It may be used multiple times within an HTML document. It can also be used to denote elements like blog entries or user posts.

inline styling When CSS is placed directly in the tag using the style attribute.

RGB A color system used in CSS that uses three color levels (red, green and blue) to create a color. Each RGB level can be from 0-255 with 255 being the most intense and 0 being the least intense.

Hex Colors A color system used in CSS that works in a similar way to the RGB method by starting with the # symbol and having the first two digits be red, the second two green and the third two blue.

This method uses hexadecimal numbers on a scale 0 though FF. 0 is the least intense and FF is the most. FF represents a decimal value of 255.

TABLE 2 - 1