0% found this document useful (0 votes)
23 views18 pages

HTML Documents

The document defines several essential HTML elements: 1) All HTML documents require <!DOCTYPE html> and must contain <html> and <body> tags. 2) Common text elements include headings (<h1>-<h6>), paragraphs (<p>), and links (<a>). 3) Lists are defined using <ul>, <ol>, and <li> tags for unordered, ordered and list items respectively. Description lists use <dl>, <dt> and <dd> tags.

Uploaded by

stephen
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
23 views18 pages

HTML Documents

The document defines several essential HTML elements: 1) All HTML documents require <!DOCTYPE html> and must contain <html> and <body> tags. 2) Common text elements include headings (<h1>-<h6>), paragraphs (<p>), and links (<a>). 3) Lists are defined using <ul>, <ol>, and <li> tags for unordered, ordered and list items respectively. Description lists use <dl>, <dt> and <dd> tags.

Uploaded by

stephen
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 18

Basic HTML Documents

By
Walujjo stephen
• All HTML documents must start with a document type declaration: <!
DOCTYPE html>.
• The HTML document itself begins with <html> and ends with </html>.
• The visible part of the HTML document is
between <body> and </body>.
Example
•<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>


<p>My first paragraph.</p>

</body>
</html>
HTML Headings
•HTML headings are defined with the <h1> to <h6> tags.

•<h1> defines the most important heading. <h6> defines


the least important heading:
Example
•<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
HTML Paragraphs
HTML paragraphs are defined with the <p> tag:

•Example
•<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML Links
HTML links are defined with the <a> tag:

•Example
•<a href="https://www.mtac.com">This is a link</a>
•The link's destination is specified in the href attribute.

•Attributes are used to provide additional information


about HTML elements.
HTML Images

HTML images are defined with the <img> tag.

The source file (src), alternative text (alt), width, and height are
provided as attributes:

Example
<img src="mtac.jpg" alt=“mtac" width="104" height="142">
HTML <button> Tag

•Example
A clickable button is marked up as follows:
<button type="button">Click Me!</button>
Definition and Usage

•The <button> tag defines a clickable button.

•Inside a <button> element you can put text (and tags


like <i>, <b>, <strong>, <br>, <img>, etc.). That is not
possible with a button created with the <input> element!

•Tip: Always specify the type attribute for


a <button> element, to tell browsers what type of button
it is.
Attributes
Attribute
autofocus
Value
autofocus
Description
Specifies that a button should
automatically get focus when the page
loads
disabled disabled Specifies that a button should be disabled

form form_id Specifies which form the button belongs


to
formaction URL Specifies where to send the form-data
when a form is submitted. Only for
type="submit"
formenctype application/x-www-form-urlencoded Specifies how form-data should be
multipart/form-data encoded before sending it to a server.
text/plain Only for type="submit"
formmethod get Specifies how to send the form-data
post (which HTTP method to use). Only for
type="submit"
formnovalidate formnovalidate Specifies that the form-data should not
be validated on submission. Only for
type="submit"
formtarget _blank Specifies where to display the response
_self after submitting the form. Only for
_parent type="submit"
_top
framename
name name Specifies a name for the button
• Type button reset submit Specifies the type of button

Value text Specifies an initial value for the button


HTML Lists
HTML lists allow web developers to group a set of related items in lists.

Example
An unordered HTML list:
• Item
• Item
• Item
• Item

An ordered HTML list:


1. First item
2. Second item
3. Third item
HTML Lists cont…
Unordered HTML List

An unordered list starts with the <ul> tag. Each list item starts
with the <li> tag.

The list items will be marked with bullets (small black circles) by
default:
Example
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Ordered HTML List

An ordered list starts with the <ol> tag. Each list item
starts with the <li> tag.

The list items will be marked with numbers by default:


Example
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
HTML Description Lists

HTML also supports description lists.

A description list is a list of terms, with a description of each term.

The <dl> tag defines the description list, the <dt> tag defines the
term (name), and the <dd> tag describes each term:
Example
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
HTML List Tags
Tag Description

<ul> Defines an unordered list

<ol> Defines an ordered list

<li> Defines a list item

<dl> Defines a description list

<dt> Defines a term in a description list

<dd> Describes the term in a description list


End of HTML Document

You might also like