Scribd
Upload
127 views

01 - HTML Intro

HTML is a markup language used to define the structure and layout of web pages. HTML uses tags like <h1> and <p> to mark headings and paragraphs and tags like <b> and <i> for formatting text. HTML documents are made up of nested HTML elements that describe the content and are displayed by web browsers. Common HTML elements include headings, paragraphs, line breaks, and fonts.

Uploaded by

Bawaihi Muhammad
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
127 views

01 - HTML Intro

HTML is a markup language used to define the structure and layout of web pages. HTML uses tags like <h1> and <p> to mark headings and paragraphs and tags like <b> and <i> for formatting text. HTML documents are made up of nested HTML elements that describe the content and are displayed by web browsers. Common HTML elements include headings, paragraphs, line breaks, and fonts.

Uploaded by

Bawaihi Muhammad
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 21

WEB PROGRAMMING

HTML Introduction
What is HTML?

 HTML is a language for describing web


pages.
 HTML stands for Hyper Text Markup
Language
 HTML is a markup language
– A markup language is a set of markup tags
– HTML uses markup tags to describe web pages
HTML Tags

 HTML markup tags are usually called HTML tags


 HTML tags are keywords surrounded by angle
brackets like <html>
 HTML tags normally come in pairs like <b> and
</b>
 The first tag in a pair is the start tag, the second tag
is the end tag
 Start and end tags are also called opening tags and
closing tags.
HTML Element

 An HTML element starts with a start tag


 An HTML element ends with an end tag
 The element content is everything between the start
and end tag
 Some HTML elements have empty content
 Some HTML elements have a missing end tag
 Note: The start tag can have additional information
(attributes)
Nested HTML

 Most HTML elements can be nested (can contain


other HTML elements).
 Most HTML documents consist of nested HTML
elements
 The <html> element defines the whole HTML
document.
 The element has a start tag <html> and an end tag
</html>
 The element content is another element (the body)
Empty HTML Elements

 HTML elements without content are called empty


elements. Empty elements have no end tag.
 <br /> is an empty element without a closing tag.
 In XHTML, XML, and future versions of HTML, all
elements must be closed.
 Adding a slash to the start tag, like <br />, is the
proper way of closing empty elements, accepted by
HTML, XHTML and XML
HTML Documents - Web Pages

 HTML documents describe web pages


 HTML documents contain HTML tags and plain text
 HTML documents are also called web pages
 The purpose of a web browsers (like Internet
Explorer) is to read HTML documents and display
them as web pages.
– The browser does not display the HTML tags, but uses the
tags to interpret the content of the page
What Do You Need?

 HTML Editor
– Notepad
– FrontPage, etc
 Browser
– Mozilla Firefox
– Opera
– IE
HTM or HTML Extension?

 When you save an HTML file, you can use


either the .htm or the .html extension.
 We use .htm in our examples. It is a habit
from the past, when the software only
allowed three letters in file extensions
HTML Headings

 Headings are defined with the <h1> to <h6> tags.


– <h1> defines the largest heading.
– <h6> defines the smallest heading.
 Use the HTML heading tags for headings only. Don't
use headings to make something BIG or bold.
 H1 headings should be used as main headings,
followed by H2 headings, and less important H3
headings, and so on
 Note: Browsers automatically adds an empty line
before and after headings
Headings
HTML Paragraphs

 Paragraphs are defined with the <p> tag.


 Most browsers will display HTML correctly even if
you forget the end tag.
 The example above will work in most browsers, but
don't rely on it. Forgetting the end tag can produce
unexpected results or errors.
 Note: Future version of HTML will not allow you to
skip end tags
Paragraphs

<p>This is a paragraph</p>
<p>This is another paragraph</p>

<p>This is a paragraph
<p>This is another paragraph
Problem with Paragraph

 Ignore code with more than one space


 How to show code sintax like
if($i % 2 == 0)
{
echo “even”
}
HTML Line Breaks

 Use the <br /> tag if you want a line break (a


new line) without starting a new paragraph
 The <br /> tag is an empty tag. It has no end
tag like </br>.
 In future versions of HTML, tags with no end
tags (closing tags) are not allowed.
 Even if <br> works in all browsers, writing
<br /> instead is more future proof.
Line Breaks

My favorite sports are : <br />


Soccer <br />
Baseball <br />
Basketball

<p>This is<br />a para<br />graph with line


breaks</p>
HTML Formatting Tags

 HTML uses tags like <b> and <i> for


formatting output, like bold or italic text.
 These HTML tags are called formatting tags
 Output examples :
– This text is bold
– This text is italic
– This is subscript and superscript
Text Formatting Tags
HTML Fonts

 With <font> tag you can specify both the size


and the type of the browser output
 The <font> Tag Should NOT be Used
– The World Wide Web Consortium (W3C) has
removed the <font> tag from its
recommendations.
 In future versions of HTML, style sheets
(CSS) will be used to define the layout and
display properties of HTML elements.
Fonts

<font face="Verdana">I'm Verdana</font>


<font size=“6">Using size=6</font>
<font color="yellow">My color is yellow</font>

You might also like