0% found this document useful (0 votes)
53 views14 pages

Prof. Varsha Tank (IT/ICT Dept. - Ljiet) : Presented by

The document discusses HTML frames and meta tags. HTML frames allow dividing the browser window into multiple sections that can each load a separate HTML document. Frames are created using the <frameset> tag which divides the window into rows and columns. Each frame is indicated by the <frame> tag. Meta tags provide metadata or information about an HTML document, such as keywords, description, author, and more. The <meta> tag is an empty element that carries attribute-value pairs. Common meta tag attributes include name, content, http-equiv, charset, and viewport. Examples are provided for defining keywords, description, author, refreshing a page, and setting the viewport for responsive design
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)
53 views14 pages

Prof. Varsha Tank (IT/ICT Dept. - Ljiet) : Presented by

The document discusses HTML frames and meta tags. HTML frames allow dividing the browser window into multiple sections that can each load a separate HTML document. Frames are created using the <frameset> tag which divides the window into rows and columns. Each frame is indicated by the <frame> tag. Meta tags provide metadata or information about an HTML document, such as keywords, description, author, and more. The <meta> tag is an empty element that carries attribute-value pairs. Common meta tag attributes include name, content, http-equiv, charset, and viewport. Examples are provided for defining keywords, description, author, refreshing a page, and setting the viewport for responsive design
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/ 14

Prof. Varsha Tank (IT/ICT Dept.

-
Presented by :
LJIET)
UNIT – 2
HTML AND CSS – cont.
Topics to be covered
 HTML Frames
 HTML metatag
HTML - Frames
 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.

 Creating Frames

 To use frames on a page we use <frameset> tag instead of <body> tag.


 The <frameset> tag defines, how to divide the window into frames.
 T h e   row s   a t t r i b u t e o f < f ra m e s e t > t a g d e f i n e s h o r i z o n t a l f ra m e s
and cols attribute defines vertical frames.
 Each frame is indicated by <frame> tag and it defines which HTML document
shall open into the frame.
Values to frameset tag
The size or width of the column and row is set in the frameset in the following
ways
 Use absolute value in pixel
Example:
 <frameset cols = "300, 400, 300">

 Use percentage value


Example:
 <frameset rows= "30%, 40%, 30%">

 Use wild card values:


Example:
 <frameset cols = "30%, *, 30%">
 In the above example * will take the remaining percentage for creating vertical
frame.
Nested Framesets
 You can achieve more complex layouts by using nested tags.
 Any frame within a frameset can contain another frameset.
 For example, shows a layout of two columns, the first with two rows and the
second with three rows. This is created by nesting two tags with row
specifications within a top-level that specifies the columns:
HTML Frames - cont.
 Advantages:
 It allows the user to view multiple documents within a single Web page.
 It load pages from different servers in a single frameset.
 The older browsers that do not support frames can be addressed using the tag.

 Disadvantages: Due to some of its disadvantage it is rarely used in web browser.


 Frames can make the production of website complicated.
 A user is unable to bookmark any of the Web pages viewed within a frame.
 The browser’s back button might not work as the user hopes.
 The use of too many frames can put a high workload on the server.
 Many old web browser doesn’t support frames.

 Note: This tag is not supported in HTML5.


HTML Frames - cont.
 Supported Browser: The browser supported by
<frame> tag are listed below:
 Google Chrome
 Internet Explorer

 Firefox

 Opera

 Safari
HTML - Meta Tags
 The metadata means information about data.

 The <meta> tag in HTML provides information about HTML Document or in


simple words, it provides important information about a document.

 These tags are basically used to add name/value pairs to describe


properties of HTML document, such as expiry date, author name, list of
keywords, document author, etc.

 This tag is an empty element because it only has an opening tag and no
closing tag but it carries information within its attributes.

 A web document can include one or more meta tag depending on


information, but in general, it doesn’t affect the physical appearance of the
document.
Meta Tag Attribute
 Name
 Name for the property. Can be anything. Examples include, keywords,
description, author, revised, generator etc.

 content
 Specifies the property's value.

 http-equiv
 Used for http response message headers. For example, http-equiv can
be used to refresh the page or to set a cookie. Values include content-
type, expires, refresh and set-cookie.

 Charset
 Specifies the character encoding for the HTML document
Meta Tag Attribute – cont.
 Viewport
 The viewport is the user's visible area of a web page.

 It varies with the device - it will be smaller on a mobile phone than on a


computer screen.
 <meta name="viewport" content="width=device-width, initial-scale=1.0">

 This gives the browser instructions on how to control the page's


dimensions and scaling.

 The width=device-width part sets the width of the page to follow the


screen-width of the device (which will vary depending on the device).

 The initial-scale=1.0 part sets the initial zoom level when the page is


first loaded by the browser.
Examples
 Define keywords for search engines:
 <meta name="keywords" content="HTML, CSS, JavaScript">

 Define a description of your web page:


 <meta name="description" content="Free Web tutorials for HTML and CSS">

 Define the author of a page:


 <meta name="author" content="John Doe">

 Refresh document every 30 seconds:


 <meta http-equiv="refresh" content="30">

 Defining Viewport
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
Examples – cont.

Without viewport metatag With viewport metatag

You might also like