Scribd
Upload
15 views14 pages

HTML

HTML (Hyper Text Markup Language) is the standard markup language for creating web pages, consisting of elements that define the structure and presentation of content. XHTML is a stricter version of HTML that adheres to XML standards, requiring well-formed markup. DHTML (Dynamic HTML) combines HTML, CSS, and JavaScript to create interactive and animated web pages, enhancing user experience.

Uploaded by

ihhridoy000
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
15 views14 pages

HTML

HTML (Hyper Text Markup Language) is the standard markup language for creating web pages, consisting of elements that define the structure and presentation of content. XHTML is a stricter version of HTML that adheres to XML standards, requiring well-formed markup. DHTML (Dynamic HTML) combines HTML, CSS, and JavaScript to create interactive and animated web pages, enhancing user experience.

Uploaded by

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

HTML is the standard markup language for creating Web pages.

What is HTML?
 HTML stands for Hyper Text Markup Language
 HTML is the standard markup language for creating Web pages
 HTML describes the structure of a Web page
 HTML consists of a series of elements
 HTML elements tell the browser how to display the content
 HTML elements label pieces of content such as "this is a heading", "this is
a paragraph", "this is a link", etc.

What is an HTML Element?


An HTML element is defined by a start tag, some content, and an end tag:

<tagname> Content goes here... </tagname>


The HTML element is everything from the start tag to the end tag:

<h1>My First Heading</h1>


<p>My first paragraph.</p>

HTML Attributes
HTML attributes provide additional information about HTML elements.

HTML Attributes
 All HTML elements can have attributes
 Attributes provide additional information about elements
 Attributes are always specified in the start tag
 Attributes usually come in name/value pairs like: name="value"
The href Attribute
The <a> tag defines a hyperlink. The href attribute specifies the URL of the page
the link goes to

What is XHTML?
 XHTML stands for EXtensible HyperText Markup Language
 XHTML is a stricter, more XML-based version of HTML
 XHTML is HTML defined as an XML application
 XHTML is supported by all major browsers

Why XHTML?
XML is a markup language where all documents must be marked up correctly
(be "well-formed").

XHTML was developed to make HTML more extensible and flexible to work with
other data formats (such as XML). In addition, browsers ignore errors in HTML
pages, and try to display the website even if it has some errors in the markup.
So XHTML comes with a much stricter error handling.

If you want to study XML, please read our XML Tutorial.

The Most Important Differences from


HTML
 <!DOCTYPE> is mandatory
 The xmlns attribute in <html> is mandatory
 <html>, <head>, <title>, and <body> are mandatory
 Elements must always be properly nested
 Elements must always be closed
 Elements must always be in lowercase
 Attribute names must always be in lowercase
 Attribute values must always be quoted
 Attribute minimization is forbidden
HTML Tags
HTML tags are like keywords which defines that how web browser will format
and display the content. With the help of tags, a web browser can distinguish
between an HTML content and a simple content. HTML tags contain three
main parts: opening tag, content and closing tag. But some HTML tags are
unclosed tags.

When a web browser reads an HTML document, browser reads it from top to
bottom and left to right. HTML tags are used to create HTML documents and
render their properties. Each HTML tags have different properties.

An HTML file must have some essential tags so that web browser can
differentiate between a simple text and HTML text. You can use as many
tags you want as per your code requirement.

o All HTML tags must enclosed within < > these brackets.
o Every tag in HTML perform different tasks.
o If you have used an open tag <tag>, then you must use a close tag </tag>
(except some tags)

Syntax
<tag> content </tag>

HTML Form
An HTML form is a section of a document which contains controls such as
text fields, password fields, checkboxes, radio buttons, submit button, menus
etc.

An HTML form facilitates the user to enter data that is to be sent to the
server for processing such as name, email address, password, phone
number, etc. .

Why use HTML Form


HTML forms are required if you want to collect some data from of the site
visitor.

For example: If a user want to purchase some items on internet, he/she must
fill the form such as shipping address and credit/debit card details so that
item can be sent to the given address.

HTML Form Tags


Let's see the list of HTML 5 form tags.

Tag Description

<form> It defines an HTML form to enter inputs by the used side.

<input> It defines an input control.

<textarea> It defines a multi-line input control.

<label> It defines a label for an input element.

<fieldset> It groups the related element in a form.

<legend> It defines a caption for a <fieldset> element.

<select> It defines a drop-down list.

<optgroup> It defines a group of related options in a drop-down list.

<option> It defines an option in a drop-down list.

<button> It defines a clickable button.


DHTML
DHTML stands for Dynamic Hypertext Markup language i.e., Dynamic
HTML.

Dynamic HTML is not a markup or programming language but it is a term


that combines the features of various web development technologies for
creating the web pages dynamic and interactive.

The DHTML application was introduced by Microsoft with the release of the
4th version of IE (Internet Explorer) in 1997.

Components of Dynamic HTML


DHTML consists of the following four components or languages:

47.9M

866

Java Try Catch

Next

Stay

o HTML 4.0
o CSS
o JavaScript
o DOM.

HTML 4.0

HTML is a client-side markup language, which is a core component of the


DHTML. It defines the structure of a web page with various defined basic
elements or tags.

CSS

CSS stands for Cascading Style Sheet, which allows the web users or
developers for controlling the style and layout of the HTML elements on the
web pages.
JavaScript

JavaScript is a scripting language which is done on a client-side. The various


browser supports JavaScript technology. DHTML uses the JavaScript
technology for accessing, controlling, and manipulating the HTML elements.
The statements in JavaScript are the commands which tell the browser for
performing an action.

DOM

DOM is the document object model. It is a w3c standard, which is a standard


interface of programming for HTML. It is mainly used for defining the objects
and properties of all elements in HTML.

Uses of DHTML
Following are the uses of DHTML (Dynamic HTML):

o It is used for designing the animated and interactive web pages that are
developed in real-time.
o DHTML helps users by animating the text and images in their documents.
o It allows the authors for adding the effects on their pages.
o It also allows the page authors for including the drop-down menus or rollover
buttons.
o This term is also used to create various browser-based action games.
o It is also used to add the ticker on various websites, which needs to refresh
their content automatically.

Features of DHTML
Following are the various characteristics or features of DHTML (Dynamic
HTML):

o Its simplest and main feature is that we can create the web page
dynamically.
o Dynamic Style is a feature, that allows the users to alter the font, size,
color, and content of a web page.
o It provides the facility for using the events, methods, and properties. And,
also provides the feature of code reusability.
o It also provides the feature in browsers for data binding.
o Using DHTML, users can easily create dynamic fonts for their web sites or
web pages.
o With the help of DHTML, users can easily change the tags and their
properties.
o The web page functionality is enhanced because the DHTML uses low-
bandwidth effect.

Difference between HTML and DHTML


Following table describes the differences between HTML and DHTML:

HTML (Hypertext Markup language) DHTML (Dynamic Hypertext Markup


language)

1. HTML is simply a markup language. 1. DHTML is not a language, but it is a set of


technologies of web development.

2. It is used for developing and creating 2. It is used for creating and designing the
web pages. animated and interactive web sites or pages.

3. This markup language creates static 3. This concept creates dynamic web pages.
web pages.

4. It does not contain any server-side 4. It may contain the code of server-side
scripting code. scripting.

5. The files of HTML are stored with 5. The files of DHTML are stored with
the .html or .htm extension in a system. the .dhtm extension in a system.

6. A simple page which is created by a 6. A page which is created by a user using the
user without using the scripts or styles HTML, CSS, DOM, and JavaScript technologies
called as an HTML page. called a DHTML page.
7. This markup language does not need 7. This concept needs database connectivity
database connectivity. because it interacts with users.

Three ways to apply CSS


To use CSS with HTML document, there are three ways:

o Inline CSS: Define CSS properties using style attribute in the HTML
elements.
o Internal or Embedded CSS: Define CSS using <style> tag in
<head> section.
o External CSS: Define all CSS property in a separate .css file, and then
include the file with HTML file using tag in section.
HTML Event Attributes
When a browser reacts on user action, then it is called as an event. For example, when yo

the submit button, then if the browser displays an information box.

In HTML5 there are lots of event attributes available which can be activated using a progr

language such as JavaScript.

Following is a table of event attributes, using these attributes you can perform several eve

Windows Event Attributes


Windows events are related for the window object, and it can only be applied with <body>

Attribute Description

onafterprint Executed the script after the document is printed.

onbeforeprint Executed the script before the document is printed.

onbeforeunlo Executed the script before a document being unloaded.


ad

onerror Executed the script when an error occurs.

onhashchang Executed the script when the anchor part in URL of the webpage is
e changed.

onload Executed the script when the webpage is entirely loaded.

onmessage Executed the script when a message event occurs.

onoffline Executed the script when the network connection is disconnected, and
browser started working offline.

ononline Executed the script when the browser started working online
onpagehide Executed the script when the current webpage is hidden such as if the
user has moved away from the current webpage.

onpageshow Executed the script when the current webpage is focused.

onpopstate Executed the script when the window's active history is changed.

onresize Executed the script when the window is resized.

onstorage Executed the script when web storage is updated.

onunload Executed the script when the current webpage is unloaded, or window
is closed.

Form Event Attributes


Form event occurs when the user performs some action within the form such as submittin

selecting input field, etc.

The form events can be used with any element, but these are mainly used with HTML form

Following is the list of all Form Event attributes:

Attribute Description

onblur Executed the script when form element loses the focus.

onchange Executed the script when the value of the element is changed.

onfocus Trigger an event when the element gets focused.

oninput Executed the script when the user enters input to the element.

oninvalid Executed the script when the element does not satisfy its predefined
constraints.

onreset Triggers the event when user reset the form element values.
onsearch Triggers the event when a search field receives some input.

onselect Triggers the event when the user has selected some text.

onsubmit Triggers the event when a form is submitted.

Keyboard Event Attributes


Keyboard event occurs when a user interacts with the keyboard. Following is a list of the K

event.

Attribute Description

onkeydow Triggers the event when the user presses down a key on the keyboard.
n

onkeypres Trigger the event when the user presses the key which displays some
s character.

onkeyup Trigger the event when the user releases the currently pressed key.

Mouse Event Attributes

Attribute Description

onclick Trigger the event when the mouse clicks on the element.

ondblclick Trigger the event when mouse double-click occurs on the element.

onmousedown Trigger the event when the mouse button is pressed on the element.

onmousemove Trigger the event when the mouse pointer moves over the element.
onmouseout Trigger the event when the mouse moves outside the element.

onmouseover Trigger the event when the mouse moves onto the element.

onmouseup Trigger the event when the mouse button is released.

onmousewheel Deprecated. Use the onwheel attribute.

onwheel Trigger the event when the mouse wheel rolls up or down on the
element

Clipboard Event Attributes

Attribute Description

oncopy Trigger the event when the user copies the content to the system clipboard.

oncut Trigger the event when the content of an element is cut and copy to the
clipboard.

onpaste Trigger the event when the user pastes some content in an element.

Media Event Attributes

Attribute Description

onabort Executed the script when media playback is aborted.

oncanplay Executed the script when the media file is ready to play.

oncanplaythrou Executed the script when the media file is ready to play without
gh buffering or stopping.

oncuechange Executed the script text cue of <track> element is changed.

ondurationchan Executed the script when the media file duration is changed.
ge

onemptied Executed the script if media occurs some fatal error, and the file
becomes unavailable.

onended Executed the script when the media file occurs its end point.

onerror Executed the script when some error occurred while fetching the media
data.

onloadeddata Executed the script when media data is loaded.

onloadedmetad Executed the script when metadata of media file is loaded.


ata

onloadstart Executed the script when loading of media file starts.

onpause Executed the script when media playback is paused.

onplay Executed the script when media file ready to play after being paused.

onplaying Executed the script when media file is started playing.

onprogress Executed the script when the browser is in the process of getting the
media data.

onratechange Executed the script when playback speed changed.

onseeked Executed the script when seek operation is ended and seeking attribute
is set to false.

onseeking Executed the script when seek operation is active and seeking attribute
is set to true.

onstalled Executed the script when browser unexpectedly stopped fetching the
data media.

onsuspend Executed the script if fetching of media data is intentionally stopped.


ontimeupdate Executed the script when playback position is changed, such as if a
user fasts forward the track.

onvolumechang Executed the script when media volume is changed (muted or


e unmuted).

onwaiting Executed the script if playback pause to wait for loading more data.

You might also like