0% found this document useful (0 votes)
6 views6 pages

HTML 2

Uploaded by

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

HTML 2

Uploaded by

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

HTML Block and Inline Elements

Every HTML element has a default display value, depending on what type of
element it is.

There are two display values: block and inline.


Block-level Elements
A block-level element always starts on a new line.

A block-level element always takes up the full width available (stretches out to
the left and right as far as it can).

A block level element has a top and a bottom margin, whereas an inline element
does not.
<p>,<list>,<h1> to <h6>
etc

Inline Elements
An inline element does not start on a new line.
An inline element only takes up as much width as necessary.
<a>,<strong> <abbr>

HTML lists are used to present list of information in well formed and semantic
way. There are three different types of list in HTML and each one has a specific
purpose and meaning.
 Unordered list — Used to create a list of related items, in no particular order.
 Ordered list — Used to create a list of related items, in a specific order.
 Description list — Used to create a list of terms and their descriptions.
HTML Unordered Lists
An unordered list created using the <ul> element, and each list item starts with
the <li> element.

HTML Ordered Lists


An ordered list created using the <ol> element, and each list item starts with the
<li> element. Ordered lists are used when the order of the list's items is
important.

The list items in an ordered list are marked with numbers.

HTML Description Lists


A description list is a list of items with a description or definition of each item.

The description list is created using <dl> element. The <dl> element is used in
conjunction with the <dt> element which specify a term, and the <dd> element
which specify the term's definition.

Browsers usually render the definition lists by placing the terms and definitions
in separate lines, where the term's definitions are slightly indented.

HTML Frame

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.

Inline Frame
Inline Frame or an iframe is allows us to open new pages inside main pages.
Inline frames are also referred to as Floating frames. <iframe> .. </iframe> tag is
used to create inline or floating frame.
Note: Netscape navigator, version 4 or older does not support iframes. If the
browser doesn't support iframe then it won't be visible.

Attributes of <iFrame> tag :


name: used to set a name for the iframe.
src: Specifies the url of the document to be loaded into the iframe.
Width: used to specify the width of the iframe.
Height: used to specify the height of the iframe.
Frameborder: used to specify the whether to have a border for the iframe or
not. This attribute possibly takes two values. i.e, 1 for on and 0 for off.
Scrolling: used to specify whether the iframe should have scrolling capability or
not. This attribute possibly takes two values i.e, 1 for on and 0 for off.
Server-side and client-side image maps
The implementation of image maps requires the processing of the mouse click
coordinates in conjunction with knowing the image areas and their associated
hypertext links. The processing can take place in one of two places:
On the server where the Web pages are stored.
In the Web browser.

Originally, the only option for processing image maps was to do so on the server.
However, later versions of HTML have added features allowing client-side
processing.
Many people are now developing their new pages (and updating older pages)
to process image maps in the Web browser itself, thus reducing the amount of
processing required by the server.

client-side image maps

Client-side imagemaps are clickable images that don't require a CGI program to
make them work. Instead, the browser interprets the imagemap based on HTML
tags. Because they are faster and more reliable, client-side imagemaps have
largely supplanted server-side imagemaps.

<IMG SRC="image" USEMAP="mapname">


<MAP NAME="name">
<AREA SHAPE="method" COORDS="coordinates" HREF="url">
<AREA SHAPE="method" COORDS="coordinates" HREF="url">
<AREA SHAPE="method" COORDS="coordinates" HREF="url">
<AREA SHAPE="method" NOHREF>
</MAP>
Replace method with the shape of the region to be mapped (that is, rect, circle,
or poly).
rect: The simplest method, the coordinates define the x,y of the upper left
corner and the coordinate of the lower right corner, in that order.
circle: The three coordinates for a circle represent the x,y coordinates for the
center of the circle, and the radius of the circle in pixels, in that order.
poly: Indicates non-rectangular polygons. Each x,y coordinate is a vertex of the
polygon

Clients-side image maps have a number of advantages over server-side maps.


Reduced server load, since the mapping is done on the client.
There is no need to communicate with server side scripts.
The user can see the image maps associated hypertext URLs in the status bar of
their browser before clicking.

server-side image-map in HTML

HTML Form Attributes


The Action Attribute
The action attribute defines the action to be performed when the form is
submitted.
Usually, the form data is sent to a file on the server when the user clicks on the
submit button.
This file contains a server-side script that handles the form data:

Target Attribute
The target attribute specifies where to display the response that is received after
submitting the form.
Method OF sending
Appends the form data to the URL, in name/value pairs
NEVER use GET to send sensitive data! (the submitted form data is visible in the
URL!)
The length of a URL is limited (2048 characters)
Useful for form submissions where a user wants to bookmark the result
GET is good for non-secure data, like query strings in Google
Notes on POST:

Appends the form data inside the body of the HTTP request (the submitted form
data is not shown in the URL)
POST has no size limitations, and can be used to send large amounts of data.
Form submissions with POST cannot be bookmarked

The Novalidate Attribute


The novalidate attribute is a boolean attribute.
When present, it specifies that the form-data (input) should not be validated
when submitted.

You might also like