week 1 sessions 1-3 html - tags and attributes

* Property of STI

of 42HTML - Tags and Attributes

H0073

Hypertext Markup Language

HTML stands for HyperText Markup Language

Hyper refers to creating linked and

nonlinear structures of information.

Text refers to the words on the computer

screen that we are marking up.

Markup is the process of preparing the text

to define how it displays when viewed as

pages on the WWW by marking them with

formatting directions conveyed by notations

called ―tags.‖

Language is a system of signs used for

communication—written and oral.

1 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI

Page 3 of 42HTML - Tags and Attributes

H0073

Text Editor

Notepad from Microsoft is the common HTML

Text Editor.

Microsoft Word and WordPerfect can also be

used to create HTML document.

HTML documents has a file extension .html

or .htm

3 __________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Hypertext Markup Language

HTML is a document-layout and hyperlink-

specification language.

HTML is a set of logical codes (markup) in

parentheses that constitute the appearance of a

web document and the information it contains.

Example:

<B>This text would appear bold in the

browser</B>

HTML is platform independent.

The basic syntax and semantics of HTML are

defined in the HTML standard.

2 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Elements of a Web Page

Title : A Web page’s title identifies the subject

or purpose of the page.

Body : The body of the Web page contains

information that displays in the browser window.

Normal text : It is the text that makes up the

main content of a Web page.

Headings : These are used to set off different

paragraphs of text or different sections of a

page.

Image : It is another important element of a

Web page such as an icon, bullet, line, photo,

illustration or other picture.

Hyperlink : It serve as a primary way to

navigate between pages.

4 __________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Web Page Document Structure

The easiest way to create and develop a

document is to type the required elements in as

a starting point.

In Notepad you would start with:

<HTML>

<HEAD>

<TITLE></TITLE>

</HEAD>

<BODY>

</BODY>

</HTML>

Although, HTML is not case sensitive, it is a

standard practice to always type HTML tags in

uppercase letters.

5 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

The <HEAD> tag

The <HEAD> tag specifies that the lines within

the beginning and ending points of the tag are

the prologue to the rest of the file.

The <HEAD> tag has no attributes and serves

only to encapsulate the other header tags.

<HEAD>

Function:

Defines the document header

Attributes:

None

End tag:

</HEAD>; rarely omitted

7 __________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

The <HTML> tag

The <HTML> and </HTML> tags serve to delimit

the beginning and ending of an HTML

document.

<HTML>

Function:

Delimits a complete HTML document

Attributes:

VERSION

End tag:

</HTML>; may be omitted

When the <HTML> tag appears without the

version attribute, the HTML document server

and browser assume the version of HTML used

in this document is supplied to the browser by

the server.

6 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

The <TITLE> tag

The <TITLE> tag defines the title for your

document.

<TITLE>

Function:

Defines the document title

Attributes:

None

End tag:

</TITLE>; never omitted

Example:

<HTML>

<HEAD>

<TITLE>Web Development</TITLE>

</HEAD>

</HTML>

8 __________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

The <BODY> tag

The document body is where you put the

contents of your document.

<BODY>

Function:

Defines the document body

Attributes:

ALINK (Netscape only), BACKGROUND

(extension), BGCOLOR (extension),

BGPROPERTIES (Internet Explorer only),

LEFTMARGIN (Internet Explorer only), LINK

(extension), TEXT (extension), TOPMARGIN

(Internet Explorer only), and VLINK

(extension)

End tag:

</BODY>; may be omitted

9 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

The <BODY> Attributes

LINK, VLINK, and ALINK: These attributes

control the colors of the different link states:

LINK - initial appearance – default = Blue

VLINK - visited link – default = Purple

ALINK - active link being clicked – default =

Red

<BODY BGCOLOR="#FFFFFF" TEXT="#FF0000"

LINK="#0000FF" VLINK="#FF00FF"

ALINK="FFFF00">

Image Background: use BACKGROUND attribute

to set an image background for the document.

Background images are "tiled" in the web

browser.

<BODY BACKGROUND="logo.gif"

BGCOLOR="#FFFFFF">

11 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

The <BODY> Attributes

Background Color: use the BGCOLOR attribute

to set document’s background color.

<BODY BGCOLOR="#FFFFFF"></BODY>

Text Color: use TEXT attribute to control the

color of all the normal text in the document.

This will affect all of the text within the

document that is not being colored by some

other element, such as a link.

<BODY BGCOLOR="#FFFFFF"

TEXT="#FF0000"></BODY>

10 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

HTML Tags

An element is a fundamental component of the

structure of a text document.

It is the first word or character that appears inside the "<" opening bracket.

To denote the various elements in an HTML

document, you use tags.

HTML tags consist of a left angle bracket (<), a

tag name, and a right angle bracket (>).

Tags are usually paired (e.g., <H1> and </H1>)

to start and end the tag instruction.

The end tag looks just like the start tag except a slash (/) precedes the text within the brackets.

Words that follow the element and are contained inside the ">" bracket of the opening

tag are called attributes.

12 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Types of HTML Tags

There are two types of tags: container and

empty.

Container tags have both an opening and a

closing and are used to surround the text within

your document for presentation by the tag.

The closing tag name is preceded by a forward

slash.

E.g. <TITLE>Welcome to my

homepage</TITLE>

Empty tags use only an opening and tell the

browser to perform an instruction such as

breaking to the next line, inserting a horizontal

line or inserting an image.

i.e. <BR>, <HR>, <IMG src=“name”>

13 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Example

<HTML>

<HEAD>

<TITLE>Example

Page</TITLE>

</HEAD>

<BODY>

<H1>Heading 1</H1>

<H2>Heading 2</H2>

<H3>Heading 3</H3>

<H4>Heading 4</H4>

<H5>Heading 5</H5>

<H6>Heading 6</H6>

</BODY>

</HTML>

As displayed

by the browser

15 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Headings

HTML defines six levels of headings that can be

used to structure a text flow into a more

readable, more manageable document.

Inside the BODY element, heading elements H1

through H6 are generally used for major

divisions of the document.

Headings are used in order of importance, not

based on how they render in the browser.

H1 is the most important; H6 is the least

important.

The size of the text surrounded by a heading element varies from very large in an <H1> tag to

very small in an <H6> tag.

E.g. <H1> Web Development </H1>

14 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Exercise

What would be the output of the following HTML

code?

<HTML>

<HEAD>

<TITLE>Car Debugging</TITLE>

</HEAD>

<BODY>

<H1>Engine Tune-Up</H1>

<H2>Change The Oil</H2>

<H2>Change the Spark

Plugs</H2>

<H3>Prepare the New

Plugs</H3>

<H4>Remove the

Guards</H4>

<H4>Check the

Gap</H4>

</BODY>

</HTML>

16 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Output

17 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Line Break <BR>

Line breaks allow you to decide where the text

will break on a line or continue to the end of the

window.

A <BR> is an Empty Element, which may

contain attributes but it does not contain any

content.

The <BR> element does not have a closing tag

because it marks a position and does not

contain any content.

Example:

<BODY>

This is the first paragraph, at the very beginning of the body of this document. <BR> The tag above

signals the start of this second paragraph. When

rendered by a browser, it will begin slightly below the

end of the first paragraph, with a bit of extra white space between the two paragraphs. <BR> This is the

last paragraph in the example. </BODY>

19 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Paragraph

One of the most commonly used tags in

HTML is the paragraph marker, which is used to

break apart blocks of text into separate

paragraphs.

Each paragraph starts with <P> and ends with

the corresponding </P> tag.

Example:

<BODY>

This is the first paragraph, at the very beginning of the body of this document. <P> The tag

above signals the start of this second

paragraph. When rendered by a browser, it will

begin slightly below the end of the first

paragraph, with a bit of extra white space between the two paragraphs. </P> This is the

last paragraph in the example. </BODY>

18 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Horizontal Rule

The <HR> element causes the browser to

display a horizontal line (rule) in your document.

Horizontal rules give you a way to visually

separate sections of your document.

Example:

<BODY>

This text is directly above the rule. <HR>

And this text is immediately below. <P>

Whereas this text will have space before the rule. <P><HR><P> And this text has space after

the rule.

</BODY>

20 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

<HR> Attributes

Key attributes for use with the <HR> element:

Attribute Description Default Value

SIZE height of the rule in

pixels

2 pixels

WIDTH width of the rule in

pixels or percentage

of screen width

100%

NOSHADE draw the rule with a

flat look instead of a

3D look

not set (3D look)

ALIGN aligns the line (Left,

Center, Right)

Center

COLOR sets a color for the

rule (IE 3.0 or later)

No set

21 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Physical Tags

Physical style tags indicate exactly the way text is to be formatted.

This tag indicates a specific change in appearance.

Below is the list of physical tags; they can be combined to create other effect.

<B> Bold

<I> Italic

<TT> Monospaced typewriter font

<U> Underline

<S> Strike through

<BIG> Bigger print than the surrounding text

<SMALL> Smaller print

<SUB> Subscript

<SUP> Superscript

E.g.

<B><I>Text that is both bold and italic</I></B>

23 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Character Formatting

Character formatting elements allows you to:

Specify the appearance of individual

characters (bold, italic, typewriter)

Include special characters (characters with

accents, copyright and registration marks,

and so on)

Create preformatted text (text with spaces

and tabs retained)

Align text left, right, justified, and centered

Change the font, size, and color

HTML provides two general ways to apply

formatting to text, the physical style and logical

style.

22 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Physical Tags

<I>Italic</I>

To create italic text, insert an <I> tag in the

document, followed by a </I> tag.

Any text between these two tags will be

displayed in italics when viewed in a browser.

E.g. <I>This is Italic text.</I>

This is Italic text.

<B>Bold</B>

To create bold text, insert <B> and </B> tags.

Any text falling between these two tags will

appear in boldface type.

E.g. <B>This is Bold text.</B>

This is Bold text.

24 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Physical Tags

<TT>monospaced</TT>

To create text that is displayed in a

monospaced font (such as Courier), use the <TT> and </TT> tags.

Text falling between these two tags will be

displayed in a fixed-width font, similar to the

output from a teletype machine or typewriter.

E.g. <TT>Teletype appears

monospaced</TT>

Teletype appears monospaced

<S>Strike-through</S>

To create strike-through text, which is text with

a single horizontal line running through it, use the <S> and </S> tags.

E.g. <S>Strike-through text</S>

25 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Physical Tags

<SUP>superscript</SUP> and

<SUB>subscript</SUB>

Texts can be formatted as either superscript or

subscript; text that appears slightly above or

below the current line, respectively.

Numbers are usually in these forms for

mathematical equations or to indicate footnotes. Use <SUP> and </SUP> tags to mark text as

superscript.Use <SUB> and </SUB> tags to mark text as

subscript.

Examples:

Superscript text appears <SUP>above</SUP>

Subscript text appears <SUB>below</SUB>

Superscript text appears above

Subscript text appears below

27 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Physical Tags

<U>underline</U>

Use <U> and </U> tag pair to underline text/s.

You should use these tags only when absolutely

necessary, as underlined text is not widely

supported by Web browsers.

E.g. <U>Underlined text</U>

Underlined text

<BIG></BIG> and <SMALL></SMALL>

Using the <BIG> and </BIG> tags will increase

the size of the indicated text relative to the

default size.

<SMALL> and </SMALL> will make the text

smaller.

E.g. <BIG>Big is not small</BIG>

<SMALL>Small is not big</SMALL>

26 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Logical Tags

Logical style tags take the approach that

what's really important is the type of information

being displayed, rather than exactly how it

is displayed.

These are similar to the common element tags

for paragraphs or headings.

They don't indicate how the text is to be

formatted, just how it is to be used in a

document.

Logical style tags might, for example, indicate a

definition, a snippet of code, or an emphasized

word.

28 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Logical Tags

<EM>emphasis</EM>

These tag adds emphasis to the inserted texts.

Using the <EM> and </EM> tags will usually

display the indicated text in italics.

However, remember that with logical tags, the

actual appearance of the text is determined by

the end user's Web browser, not your HTML

document.

Example:

<P>Say it with <EM>emphasis</EM></P>

Say it with emphasis

29 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Preformatted Text

Preformatted text allows you to break away

from the normal rules of HTML and quickly

specify exactly how a section of text will appear

in the reader's Web browser.

When you're using preformatted text, there is no

need to use the HTML markup tags.

the text will appear exactly as you've typed

it, complete with spaces, line breaks, and

empty lines.

Preformatted text is always displayed in a

monospaced, fixed-width font.

The PRE tag (stands for preformatted), consists

of the beginning and ending tags <PRE> and

</PRE>, allows you to format the text the way

you want it.

31 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Logical Tags

<STRONG>strong emphasis</STRONG>

To mark text/s as a very important note, use

<STRONG> and </STRONG> tags.

Most browsers tend to display strongly

emphasized text in boldface.

Example:

<CITE>citation</CITE>

Use <CITE> and </CITE> to insert a citation:

to give credit for a short quotation in the body of

the document.

Citations are typically displayed in italics.

Example:

A citation gives credit where it’s due.

Anonymous, 2003

<P>Say it with <STRONG>emphasis</STRONG></P>

Say it with emphasis

<P>A citation gives credit where it’s due.

<CITE>Anonymous, 2003</CITE></P>

30 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Preformatted Example

<HTML>

<HEAD>

<TITLE>

Preformatted Text

</TITLE>

</HEAD>

<BODY>

<PRE>

( )

Moo ( oo )

\ /------------\

|| | \

||-------W|| *

|| || </PRE>

</BODY>

</HTML>

32 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Font Element

<FONT> tag lets you change the size, style, and

color of text.

It must be used like any other physical or logical

style tag for changing the appearance of a short

segment of text.

<FONT>

Function:

Set the font size for text

Attributes:

COLOR (extension), FACE (Internet

Explorer) and SIZE (extension)

End Tag:

</FONT>, always used

Example:

<FONT SIZE=5 COLOR="purple">This text will

be big and purple.</FONT>

This text will be big and purple.

33 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

FACE Attribute

The font face displayed by the browser depends

on which fonts are available on the individual

user's system.

The browser parses the list of font names, one

after the other, until it matches one with a font

name supported by the user's system.

If none match, the text display defaults to the

font style set by the user in their browser's

Preferences.

Example:

<P>This text is in the default font. But,<FONT

face="Braggadocio, Machine"> heaven

only knows </FONT> what font face is this

one?</P>

This text is in the default font. But, heaven only knows what font face is this one?

35 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

COLOR Attribute

The color attribute for the <font> tag sets the

color of the enclosed text.

The value of the attribute may be expressed in

either of two ways: as the red, green, and blue

(RGB) components of the desired color or as a

standard color name.

Enclosing quotes are recommended, but not

required.

The RGB color value, denoted by a preceding hash mark (#), is a six-digit hexadecimal

number.

For example, to create basic yellow text, you

might use:

<P>Here comes the <FONT color="#FFFF00">

sun</FONT>!</P>

Here comes the sun!

34 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

SIZE Attribute

The <FONT> tag is also use to change the size

of the font for a character, word, phrase, or on

any range of text.

The <FONT>...</FONT> tags enclose the text,

and the SIZE attribute indicates the size to

which the font is to be changed.

The values of SIZE are 1 to 7, with 3 being the

default size.

Example:

<P>Bored with your plain old font? <FONT

SIZE=5>Change it.</FONT></P>

Bored with your plain old font? Change it.

36 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Text Alignment

This is the ability to arrange a block of text such

as a heading or a paragraph so that it is aligned

against the left margin (left justification - the

default), aligned against the right margin (right

justification), or centered.

Use the ALIGN attribute to that HTML element.

ALIGN has three values: LEFT, RIGHT, or

CENTER.

Example:

<H2 align=LEFT>Who We Are</H2>

<H2 align=RIGHT>What We Do</H2>

<H2 align=CENTER>How To Reach Us</H2>

37 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Special Characters and Symbols

The following table represents some of the

more commonly used special characters.

Special

Character

Entity

Name

Special

Character

Entity

Name

ampersand & greater-than

sign

>

asterisk &lowast; less-than sign <

cent sign ¢ non-breaking

space

copyright © quotation mark "

fraction one

qtr

¼ registration mark ®

fraction one

half

½ trademark sign ™

39 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Special Characters and Symbols

These are not found on the average keyboard

that can be inserted using special character

entities.

These special characters are specified in an

internationally accepted character set known as

the ISO-Latin-1 (ISO-8859-1).

They are recognized in HTML as they begin

with an ampersand and end with a semi-colon e.g. &value;

The value will either be an entity name or a

standard ASCII character number.

Example:

<P>Web Programming © 2009 All Rights

Reserved</P>

Web Programming © 2009 All Rights Reserved

38 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Other Character Formatting Elements

<BASEFONT> </BASEFONT>

Used to set the base font size.

The size attribute is an integer value ranging

from 1 to 7.

The base font applies to the normal and

preformatted text but not to headings, except where these are modified using the FONT

element with a relative font size.

<BLOCKQUOTE></BLOCKQUOTE>

Used to enclose block quotations from other

works or to indent sections of a document.

It indents from both sides in a browser.

This element can also contain most other

formatting elements such as Headings,

paragraphs, tables, etc.

40 _________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Other Character Formatting Elements

<ADDRESS></ADDRESS>

It specifies information such as authorship and contact details for the current document.

No support for an alignment attribute with the <ADDRESS> element.

Example:

<P><BLOCKQUOTE>This is the first day of the rest of your life, make it count. </BLOCKQUOTE><CENTER><ADDRESS>180 Attwell Dr. Suite 130<BR>Toronto,ON <BR>M9W 6A9</ADDRESS></CENTER></P>

This is the first day of the rest of your life, make it count.

180 Attwell Dr. Suite 130Toronto, ONM9W 6A9

41 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

* Property of STI


H0073

Writing Comments

HTML comments describe the page itself or

provide some kind of indication of the status of

the page.

Some source code control programs can put

page status into comments, for example.

Text in comments is ignored when the HTML

file is parsed.

Comment tags consist of a beginning and ending sequence of characters ("").

Example:



42 ________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________ ___________________

week 1 sessions 1-3 html - tags and attributes

Documents