You are on page 1of 4

HTML is the standard markup language for creating Web pages.

• HTML stands for Hyper Text Markup Language


• HTML describes the structure of Web pages using markup
• HTML elements are the building blocks of HTML pages
• HTML elements are represented by tags
• HTML tags label pieces of content such as "heading", "paragraph", "table",
and so on
• Browsers do not display the HTML tags, but use them to render the content
of the page

HTML Tags
HTML tags are element names surrounded by angle brackets:
• <tagname>content goes here...</tagname>
• HTML tags normally come in pairs like <p> and </p>
• The first tag in a pair is the start tag, the second tag is the end tag
• The end tag is written like the start tag, but with a forward slash inserted
before the tag name
• The start tag is also called the opening tag, and the end tag the closing tag.

HTML Attributes
Attributes provide additional information about HTML elements.
• All HTML elements can have attributes
• Attributes provide additional information about an element
• Attributes are always specified in the start tag
• Attributes usually come in name/value pairs like: name="value"
HTML Attributes
• Below is an alphabetical list of some attributes often used in HTML:
Attribute Description
Specifies an alternative text for an image, when the image cannot be
Alt
displayed
disabled Specifies that an input element should be disabled
Href Specifies the URL (web address) for a link
Id Specifies a unique id for an element
Src Specifies the URL (web address) for an image
Style Specifies an inline CSS style for an element
Title Specifies extra information about an element (displayed as a tool tip)

HTML Formatting Elements (text & Fonts)


It is the ability to make text bold, italicized, or underlined
HTML also defines special elements for defining text with a special meaning.
HTML uses elements like <b> and <i> for formatting output, like bold or italic
text.
Formatting elements were designed to display special types of text:
• <b> - Bold text
• <strong> - Important text
• <i> - Italic text
• <em> - Emphasized text
• <mark> - Marked text
• <small> - Small text
• <del> - Deleted text
• <ins> - Inserted text
• <sub> - Subscript text
• <sup> - Superscript text
• HTML <b> and <strong> Elements
• The HTML <b> element defines bold text, without any extra importance.
The HTML <strong> element defines strong text, with added semantic
"strong" importance. HTML <i> and <em> Elements
The HTML <i> element defines italic text, without any extra importance.
The HTML <em> element defines emphasized text, with added semantic
importance.
HTML Link Colors
By default, a link will appear like this (in all browsers):
• An unvisited link is underlined and blue
• A visited link is underlined and purple
• An active link is underlined and red
You can change the default colors, by using CSS:

Defining an HTML Table


• An HTML table is defined with the <table> tag.
• Each table row is defined with the <tr> tag. A table header is defined with
the <th> tag. By default, table headings are bold and centered. A table
data/cell is defined with the <td> tag.
Note: The <td> elements are the data containers of the table.
They can contain all sorts of HTML elements; text, images, lists, other tables, etc.

HTML offers web authors three ways for specifying lists of information. All lists must
contain one or more list elements. Lists may contain −

• <ul> − An unordered list. This will list items using plain bullets.
• <ol> − An ordered list. This will use different schemes of numbers to list your items.
• <dl> − A definition list. This arranges your items in the same way as they are
arranged in a dictionary.
HTML Images
Images can improve the design and the appearance of a web page.
HTML Images Syntax
In HTML, images are defined with the <img> tag.
The <img> tag is empty, it contains attributes only, and does not have a closing
tag.
The src attribute specifies the URL (web address) of the image:

HTML Styles – CSS


Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g., fonts,
colors, spacing) to Web documents.
Styling HTML with CSS
CSS stands for Cascading Style Sheets.
CSS describes how HTML elements are to be displayed on screen, paper, or
in other media.
CSS saves a lot of work. It can control the layout of multiple web pages all at
once.

HTML Forms
• The <form> Element
• The HTML <form> element defines a form that is used to collect user
input:
• An HTML form contains form elements.
• Form elements are different types of input elements, like text fields,
checkboxes, radio buttons, submit buttons, and more.

Type Description
<input type="text"> Defines a one-line text input field
Defines a radio button (for selecting one of many
<input type="radio">
choices)
<input
Defines a submit button (for submitting the form)
type="submit">
• Text Input
• <input type="text"> defines a one-line input field for text input:
• Radio Button Input
• <input type="radio"> defines a radio button.
• EX.This is how the HTML code above will be displayed in a browser:

Male Female
The Submit Button
• <input type="submit"> defines a button for submitting the form data to a
form-handler.
• The form-handler is typically a server page with a script for processing
input data.

HTML <frame> Tag

The <frame> tag was used in HTML 4 to define one particular window (frame)
within a <frameset>.

HTML frames are used to divide your browser window into multiple sections
where each section can load a separate HTML document. A collection of frames
in the browser window is known as a frameset. The window is divided into frames
in a similar way the tables are organized: into rows and columns.

Disadvantages of Frames

There are few drawbacks with using frames, so it's never recommended to use
frames in your webpages −

• Some smaller devices cannot cope with frames often because their screen
is not big enough to be divided up.
• Sometimes your page will be displayed differently on different computers
due to different screen resolution.
• The browser's back button might not work as the user hopes.
• There are still few browsers that do not support frame technology.

You might also like