Presentation is loading. Please wait.

Presentation is loading. Please wait.

1.  Describe the anatomy of a web page  Format the body of a web page with block-level elements including headings, paragraphs, lists, and blockquotes.

Similar presentations


Presentation on theme: "1.  Describe the anatomy of a web page  Format the body of a web page with block-level elements including headings, paragraphs, lists, and blockquotes."— Presentation transcript:

1 1

2  Describe the anatomy of a web page  Format the body of a web page with block-level elements including headings, paragraphs, lists, and blockquotes  Configure the text on a web page with inline elements  Configure text with phrase elements  Configure special entity characters, line breaks, and horizontal rules  Test a web page for valid HTML syntax

3 an opening tag.... page info goes here … a closing tag

4  Head Section Contains information that describes the web page document …head section info goes here  Body Section Contains text and elements that display in the web page document …body section info goes here

5 My First Web Page.... Body info goes here …

6 Heading Level 1 Heading Level 2 Heading Level 3 Heading Level 4 Heading Level 5 Heading Level 6

7  Paragraph element …paragraph goes here… › Groups sentences and sections of text together. › Configures a blank line above and below the paragraph › Align attribute  deprecated in XHTML  obsolete in HTML5

8  Line Break element › Stand-alone tag › Called a void element in HTML5 …text goes here This starts on a new line…. › Causes the next element or text to display on a new line Read Reviews

9  Horizontal Rule element › Stand-alone tag › Configures a horizontal line on the page › In HTML5, it should be used to indicate a thematic break at the paragraph level Read Reviews

10  Blockquote element › Indents a block of text for special emphasis …text goes here…

11 Indicate the context and meaning of the text Display inline with the text Common Logical Style Tags ◦  To cause text to "stand out" from surrounding text. Usually bold. This is important ◦  To cause text to be emphasized in relation to other text on the page. Usually italics. Please note

12  Unordered List  Description List (XHTML Definition List)  Ordered List

13  Displays information with bullet points  Unordered List Element Contains the unordered list  List Item Element Contains an item in the list

14 TCP IP HTTP FTP

15  Conveys information in an ordered fashion  Ordered List Element Contains the ordered list › type attribute determines numbering scheme of list › default is numerals  List Item Element Contains an item in the list

16 Apply to school Register for course Pay tuition Attend course

17 New name for HTML5 This element was called a Definition List in previous versions of HTML and XHTML. Uses: Display a list of terms and descriptions Display a list of FAQ and answers ◦ The Description List element tag Contains the definition list ◦ The dtElement tag Contains a term or name Configures a line break above and below the text ◦ The dd Element tag Contains a definition or description Indents the text

18 IP Internet Protocol TCP Transmission Control Protocol

19 Display special characters such as quotes, copyright symbol, etc. Character Code © © < < > > & &

20  Purpose: › Configure a specially formatted division or area of a web page  There is a line break before and after the division.  Can contain other block display and inline display elements 20

21  Check your code for syntax errors › Benefit:  Valid code  more consistent browser display  W3C XHTML Validation Tool › http://validator.w3.org http://validator.w3.org  Additional HTML5 Validation Tool › http://html5.validator.nu http://html5.validator.nu

22  This chapter provided an introduction to HTML.  HTML elements used for inline and block-level formatting were introduced.  You will use these skills over and over again as you create web pages.


Download ppt "1.  Describe the anatomy of a web page  Format the body of a web page with block-level elements including headings, paragraphs, lists, and blockquotes."

Similar presentations


Ads by Google