Transcript Lesson 5

Lesson 5
XHTML Tags , Attributes and Structure
XHTML Basic Structure
• head and body
• titles
• Paragraph
• headings
• comments
Document Presentation
• Manipulating Text
• Font
• Font Style
• Images
• Horizontal Rule
Lists
• Unordered Lists
• Ordered Lists
Tags
The <html> tag identifies a document as an HTML document.
All HTML documents must start with the </html> tag and end with the
</html> tag.
An xmlns - XML namespace - is also included as part of the html tag. The
namespace declaration is considered to apply to the element where it is
specified and to all elements within the content of that element.
Using <html xmlns="http://www.w3.org/1999/xhtml"> will apply the XHTML
namespace to all elements within the HTML document.
Text Formatting
Note that in HTML we have:
• Logical Tags
• Physical Tags
• Alignment and misc. tags
Logical Tags are used to format text without specifying the exact appearance
of the text. The exact appearance of the text is left to the browsers to define.
Examples are the <em> emphasis</em and the <strong>strong</strong> tags.
Physical Tags specify the exact appearance of text. The challenge here is to
know which browsers support which tags vs. the desire by web designers to
have more control on text formatting.
Alignment and misc tags are specifically used to give the desired alignment
and to display special characters or text.
Text effects
• <b></b>
• <i></i>
• <em></em> preferred to <i>
• <strong></strong> preferred to <b>
Why?
some people listen to web pages or read them in
braille, while others use a browser that can not
display bold or italic.
Note:
• <u></u>
– Don’t use since it looks like a hyperlink
HTML has the instructions (tags, speciali characters, etc) and tries to make web
pages complaint with current and older Browsers
XHTML
Uses stylesheets but older browsers don't understand stylesheets
Here text is <B>bold!</B>
Here text is <U>underlined</U>
Here text is <I>italicized.</I>
Here text is bold!
Here text is underlined
Here text is italicized
Five is &lt; 15
And 18 is &gt; 8
All &copy;IBM software is good
And this is the &amp sign
5 is < 15
And 18 is > 8
All ©IBM software is good
and this is the & sign
Other special characters include the:
• <sub> subscript
• <sup> superscript
• &frac14
Changing fonts:
<font face=“fontname1, fontname2”>write text here</font>
Font is a deprecated tag.  Stylesheets
Font Style  Stylesheets
Need to remove Document Presentation from Document Structure
Unordered Lists
• Unordered Lists
– Are lists without any order and are rendered with a line break and a bullet
symbol
For solid bullets use
For hollow bullets use
For hollow squares use
<ul type=“disc”>
<ul type=“circle”>
<ul type=“square”>
Ordered and Nested Lists
• Ordered Lists
• Nested Lists
To
To
To
To
To
use
use
use
use
use
Arabic numerals
Capital letters
lowercase letters
Capital Roman numerals
lowercase Roman numerals
<ol
<ol
<ol
<ol
<ol
type=“1”>
type=“A”>
type=“a”>
type=“I”>
type=“i”>
Review
True/False
Every XHTML document contains a start <HTML> tag and an end </HTML>
True
Web browsers typically underline text hyperlinks and color them grey by default
False
The color is blue
Review
True/False
Every img element in a valid XHTML document must have an alt attribute
True
The img element is an example of an empty element
True
Review
True/False
The hr element inserts a line break above and below the horizontal line
True
Unordered list element ul creates a list in which each item in the list begins with a
square symbol
False
A bullet symbol unless otherwise specified
Review
True/False
XHTML provides special characters in the form &code; for representing
characters that cannot be marked up.
True
The <blockquote> works almost identical to the <p> except the whole paragraph
will be indented one tab - 3 spaces.
False
5 spaces