html tag Archives - Page 3 of 5

HTML: Audio Tag

by vikashdev kAugust 5, 2021August 5, 2021HTMLLeave a Comment

The <audio>… </audio> tag defines sound, such as music or other audio streams.

Supported Format: mp3, wav, and ogg

Attribute	Value	Description
autoplay	autoplay	Specifies that the audio will start playing as soon as it is ready
controls	controls	Specifies that audio controls should be displayed (such as a play/pause button etc)
loop	loop	Specifies that the audio will start over again, every time it is finished
muted	muted	Specifies that the audio output should be muted
preload	auto metadata none	Specifies if and how the author thinks the audio should be loaded when the page loads
src	URL	Specifies the URL of the audio file

preload

HTML: Map tag

by vikashdev kAugust 5, 2021August 5, 2021HTMLLeave a Comment

The <map>….</map> tag is used to define a client-side image-map. An image-map is an image with clickable areas.

The <map>…. </map> tag contains a number of <area> tags, that defines the clickable areas in the image map.

<map name=“mapname” id=“mapname”>……… </map>

Area Tag

The <area> tag defines an area inside an image-map. An image-map is an image with clickable areas.

The <area> element is always nested inside a <map>….</map> tag.

Attribute	Value	Description
alt	text	Specifies an alternate text for the area. Required if the href attribute is present
coords	coordinates	Specifies the coordinates of the area
download	filename	Specifies that the target will be downloaded when a user clicks on the hyperlink
href	URL	Specifies the hyperlink target for the area
hreflang	language_code	Specifies the language of the target URL
media	media query	Specifies what media/device the target URL is optimized for
shape	default rect circle poly	Specifies the shape of the area
target	_blank _parent _self _top framename	Specifies where to open the target URL
type	media_type	Specifies the media type of the target URL
rel	alternate author bookmark help license next nofollow noreferrer prefetch prev search tag	Specifies the relationship between the current document and the target URL

Coords attribute:

Tagged : area tag in html / HTML / html map tag / html tag / map tag in html

HTML: Image tag

by vikashdev kAugust 5, 2021August 5, 2021HTMLLeave a Comment

The <img> tag is used to insert images on web pages.

Attribute	Value	Description
src	URL	Specifies the URL of an image
alt	text	Specifies an alternate text for an image
width	pixels	Specifies the width of an image
height	pixels	Specifies the height of an image
ismap	ismap	Specifies an image as a server-side image-map
usemap	#mapname	Specifies an image as a client-side image-map

src attribute

<img src=“car.jpg”>
<img src=“C:\image\dog.jpg”>

alt attribute

// If the image is not to be open then its attribute message show in alt=”car”.

Width and height attribute

<img src=“car.jpg” alt=“car” width=“200” height=“100”>

ismap attribute

click coordinates are sent to the server.

Tagged : alt attribute / HTML / html tag / image insert in html / image tag in html / img tag used in html / ismap attribute in html / src attribute / usemap in html / width and height attribute in image

HTML: Sandbox

by vikashdev kAugust 4, 2021August 4, 2021HTMLLeave a Comment

The restriction to the content such as disabling script or plugins is given by the internal frame.

An iframe with sandbox value as empty will have the following restrictions: –

Forms can not be submitted
Framed document cannot navigate its top level parent
Scripts are disabled
Stops frame content from using plugins
New windows(browsing contexts) cannot be created by the framed document
Framed content will be treated from an unique origin. Hence it will not have access to data stored in earlier cookies
Disable APIs
Automatically triggered features like auto playing videos etc are blocked

<iframe sandbox> </iframe>

Values

Value	Description
(no value)	Applies all restrictions
allow-forms	Re-enables form submission
allow-pointer-lock	Re-enables APIs
allow-popups	Re-enables popups
allow-same-origin	Allows the iframe content to be treated as being from the same origin
allow-scripts	Re-enables scripts
allow-top-navigation	Allows the iframe content to navigate its top-level browsing context

allow-same-origin

A web page can have access to a second web page only if both have the same origin.

Uniform Resource Identifier (URI), Port Number, and HostName

Same-origin

https://www.google.com/p/contact-us.html
https://www.google.com/p/about-us.html

Different Port So Not in the Same Origin

https://www.google.com:82/p/contact-us.html
https://www.google.com/p/about-us.html

Different Host So Not in the Same Origin

https://en.www.google.com/p/contact-us.html
https://www.google.com/p/contact-us.html

allow-top-navigation

Top navigation allows us to open the linked document in the full body of the window or the top browsing context.

Attribute	Value	Description
target	_blank _parent _top framename _self	Opens the linked document in a new window or tab Opens the linked document in the parent frame Opens the linked document in the full body of the window Opens the linked document in a named frame Opens the linked document in the same frame as it was clicked (this is the default)

Tagged : HTML / html sandbox / html tag / iframe sandbox in html

HTML: Anchor Tag …

by vikashdev kAugust 4, 2021August 4, 2021HTMLLeave a Comment …

We can create hyperlinks using the anchor tag.

What is a Hyperlink?

A hyperlink is a link between web pages and it is used to connect one web page to another.

Ex:- <a href=”https://www.google.com”>Visit Google </a>

Anchor Tag Attributes

Attribute	Value	Description
href	URL reference	Specifies the URL as a destination web page or a different section of the web page
download	filename	Specifies that the target will be downloaded when a user clicks on the hyperlink
media	media_query	Specifies what media/device the linked document is optimized for
hreflang	language_code	Specifies the language of the linked document
type	media_type	Specifies the media type of the linked document

Anchor Tag Attributes

Attribute	Value	Description
target	_blank _parent _top framename _self	Opens the linked document in a new window or tab Opens the linked document in the parent frame Opens the linked document in the full body of the window Opens the linked document in a named frame Opens the linked document in the same frame as it was clicked (this is the default)

Ex:- <a href=”https://www.google.com”target=”_blank”>Visit Google </a>

Anchor Tag Attributes

href Attribute

Syntax: – <a href=“URL”>

An absolute URL – points to another web site. Ex: – href=”http://www.google.com”
A relative URL – points to a file within a web site. Ex:- href=“page1.html”
Link to an element with a specified id within the page. Ex: – href=”#bottom”
Other protocols. Ex:- https://, ftp://, mailto:, file:, etc..
A script. Ex:- href=‘javascript:alert(“Hello”);’

Download Attribute

The download attribute specifies that the target will be downloaded when a user clicks on the hyperlink.

Ex:- <a href=”image/example.jpg”download=”nature”>

Media Attribute

The media attribute specifies what media/device the linked document is optimized for.

This attribute is used to specify that the target URL is designed for special devices (like iPhone and Android etc), speech, or print media.

Value	Description
width	Specifies the width of the targeted display area. “min-” and “max-” prefixes can be used. Example: media=”screen and (min-width:500px)”
height	Specifies the height of the targeted display area. “min-” and “max-” prefixes can be used. Example: media=”screen and (max-height:700px)”
device-width	Specifies the width of the target display/paper. “min-” and “max-” prefixes can be used. Example: media=”screen and (device-width:500px)”
device-height	Specifies the height of the target display/paper. “min-” and “max-” prefixes can be used. Example: media=”screen and (device-height:500px)”
orientation	Specifies the orientation of the target display/paper. Possible values: “portrait” or “landscape” Example: media=”all and (orientation: landscape)”

Value	Description
aspect-ratio	Specifies the width/height ratio of the targeted display area. “min-” and “max-” prefixes can be used. Example: media=”screen and (aspect-ratio:16/9)”
device-aspect-ratio	Specifies the device-width/device-height ratio of the target display/paper. “min-” and “max-” prefixes can be used. Example: media=”screen and (aspect-ratio:16/9)”
color	Specifies the bits per color of the target display. “min-” and “max-” prefixes can be used. Example: media=”screen and (color:3)”
color-index	Specifies the number of colors the target display can handle. “min-” and “max-” prefixes can be used. Example: media=”screen and (min-color-index:256)”
monochrome	Specifies the bits per pixel in a monochrome frame buffer. “min-” and “max-” prefixes can be used. Example: media=”screen and (monochrome:2)”

Value	Description
resolution	Specifies the pixel density (dpi or dpcm) of the target display/paper. “min-” and “max-” prefixes can be used. Example: media=”print and (resolution:300dpi)”
scan	Specifies scanning method of a tv display. Possible values are “progressive” and “interlace”. Example: media=”tv and (scan:interlace)”
grid	Specifies if the output device is grid or bitmap. Possible values are “1” for the grid, and “0” otherwise. Example: media=”handheld and (grid:1)”

Value	Description
all	Default. Suitable for all devices
aural	Speech synthesizers
braille	Braille feedback devices
handheld	Handheld devices (small screen, limited bandwidth)
projection	Projectors
print	Print preview mode/printed pages
screen	Computer screens
tty	Teletypes and similar media using a fixed-pitch character grid
tv	Television type devices (low resolution, limited scroll ability)

And
Not
,(OR)

Ex:- media=”print and (resolution:300dpi)”>

hreflang Attribute

Type Attribute

http://www.iana.org/assignments/media-types/media-types.xhtml

rel Attribute

Value	Description
alternate	Links to an alternate version of the document (i.e. print page, translated or mirror)
author	Links to the author of the document
bookmark	Permanent URL used for bookmarking
help	Links to a help document
license	Links to copyright information for the document
next	The next document in a selection
nofollow	Links to an unendorsed document, like a paid link. (“nofollow” is used by Google, to specify that the Google search spider should not follow that link)
noreferrer	Specifies that the browser should not send a HTTP referer header if the user follows the hyperlink
prefetch	Specifies that the target document should be cached
prev	The previous document in a selection
search	Links to a search tool for the document
tag	A tag (keyword) for the current document

Link Color

By default, links will appear as follows in all browsers:

An unvisited link is underlined and blue

A visited link is underlined and purple

An active link is underlined and red

link – specifies the color of the hyperlink that has not been visited or clicked
before on a webpage

vlink – specifies the color of hyperlink that has been visited before on a web page

alink – specifies the color of currently active links

Tagged : a tag in html / anchor tag attributes / download attribute / how to link text in html / href attribute / hreflang attribute / HTML / html tag / hyperlink in html / link color / link color in html / media attribute / rel attribute / rel attribute in html / type attribute in html

HTML: Table create

by vikashdev kAugust 4, 2021August 4, 2021HTMLLeave a Comment

<table> ……….. </table> tags represents an HTML table.
<th> …………. </th> tags is used to add a column heading in a column.
<tr> …………. </tr> tags represents a row in the table.
<td> ……….. </td> tags are used to add data value in the column.

Name	Roll	Result
Rakesh	01	pass
Sushant	02	pass
Suraj	03	pass

Tagged : crate table in html / how to create table in html / HTML / html tag / table create in html / table tag in html

HTML: Definition List

by vikashdev kAugust 3, 2021August 3, 2021HTMLLeave a Comment

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

We can create definition list by using the <dl> ………. </dl> with <dt> and <dd> tag.

The <dt> …….. </dt> tag is used to define the term; whrereas, the <dd> tag is used to give the term’s definition.

<dl>
	<dt>College</dt>
	<dd>A boring place</dd>
	<dt>School</dt>
	<dd>Learn as much as you can</dd>
	<dt>University</dt>
	<dd>for fun</dd>
</dl>

Tagged : dd tag in html / definition list in html / dl tag in html / dt tag in html / example of definition list in html / HTML / html definition list / html tag

HTML: Ordered List

by vikashdev kAugust 3, 2021August 3, 2021HTMLLeave a Comment

An ordered list displays a list of items using numbers or letters in either ascending or descending order.

The <ol> ………. </ol> tag is used to define an ordered list ; whereas the <li> ….. </li> tag is used to define the items of list.

Ex:-

<ol>
	<li>Linux</li>
	<li>Windows</li>
	<li>Mac</li>
	<li>Android</li>
</ol>

Attribute	Value
Type	1, A, a, I, i
Start	Any numeric value
Reversed	Reversed

<ol type=1>
	<li>Linux</li>
	<li>Windows</li>
	<li>Mac</li>
	<li>Android</li>
</ol>

Tagged : example of html ordered list / example of ordered list tag / HTML / html tag / ol tag in html / ordered list in html / ordered list tag used in html

HTML: Unordered List

by vikashdev kAugust 3, 2021August 3, 2021HTMLLeave a Comment

An unordered list is used to create a bulleted list of items.

The <ul> …………….. </ul> tag is used to define an unordered list; whereas, the <li> ……… </li> tag is used to define the items of the list.

Ex:-

<ul>
	<li>Linux</li>
	<li>Windows</li>
	<li>Mac</li>
	<li>Android</li>
</ul>

Linux
Windows
Mac
Android

Tagged : HTML / html tag / ul tag / ul tag example in html / ul tag in html / unordered list / unordered list in html

HTML: Author of Web Page

by vikashdev kAugust 2, 2021August 2, 2021HTMLLeave a Comment

<meta name="author" content=“Public Shows">

Tagged : author of web page / HTML / html meta tag / html name and content / html tag

scmGalaxy

Tag: html tag

HTML: Audio Tag

preload

HTML: Map tag

Area Tag

Coords attribute:

HTML: Image tag

src attribute

alt attribute

Width and height attribute

ismap attribute

HTML: Sandbox

<iframe sandbox> </iframe>

Values

allow-same-origin

allow-top-navigation

HTML: Anchor Tag …

Anchor Tag Attributes

Anchor Tag Attributes

Anchor Tag Attributes

href Attribute

Download Attribute

Media Attribute

hreflang Attribute

Type Attribute

rel Attribute

Link Color

HTML: Table create

HTML: Definition List

HTML: Unordered List

HTML: Author of Web Page