Scribd
Upload
4 views

Web Tech Lect 7

The document discusses various aspects of iframes in HTML including syntax, setting height and width, removing borders, using as a link target, and also covers HTML colors that can be specified by name, RGB, HEX, HSL, RGBA, or HSLA values and how to set background and text colors. It provides examples of how to add an iframe and set its size, remove borders, change borders, and target links to an iframe using the name attribute.

Uploaded by

Bitan Baidya
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
4 views

Web Tech Lect 7

The document discusses various aspects of iframes in HTML including syntax, setting height and width, removing borders, using as a link target, and also covers HTML colors that can be specified by name, RGB, HEX, HSL, RGBA, or HSLA values and how to set background and text colors. It provides examples of how to add an iframe and set its size, remove borders, change borders, and target links to an iframe using the name attribute.

Uploaded by

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

Course Name – Web Technology

Lecture 7 – Iframe, Colors

Presented By
Sudipta Sahana
Asst. Prof.
Dept. of CSE
JIS College of Engineering
[email protected]
Topic of Interest

 HTML Iframe & Syntax


 Iframe - Set Height and Width
 Iframe - Remove the Border
 Iframe - Target for a Link
 HTML Colors
HTML Iframe & Syntax

The HTML <iframe> tag specifies an inline frame.

An inline frame is used to embed another document within the current HTML document.

Syntax for adding an iframe:

<iframe src="URL"></iframe>

The URL points to the location of the


separate page.
Iframe - Set Height and Width

Use the height and width attributes to specify the size of the iframe.

The height and width are specified in pixels by default:

Example –

<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe


Example"></iframe>

Or you can add the style attribute and use the CSS height and width properties:

<iframe src="demo_iframe.htm" style="height:200px;width:300px;" title="Iframe


Example"></iframe>
Iframe - Remove the Border

By default, an iframe has a border around it.

To remove the border, add the style attribute and use the CSS border property:

Example

<iframe src="demo_iframe.htm" style="border:none;" title="Iframe Example"></iframe>


Iframe - Change the Border

With CSS, you can also change the size, style and color of the iframe's border:

Example

<iframe src="demo_iframe.htm" style="border:2px solid red;" title="Iframe


Example"></iframe>
Iframe - Target for a Link
An iframe can be used as the target frame for a link.
The target attribute of the link must refer to the name attribute of the iframe:
Example
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe Example"></iframe>
<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com </a></p>
HTML Colors
HTML colors are specified with predefined color names, or with RGB, HEX, HSL, RGBA, or
HSLA values.
In HTML, a color can be specified by using a color name:
HTML Colors
Background Color - You can set the background color for HTML elements
HTML Colors
Text Color - You can set the color of text:
HTML Colors
Color Values - In HTML, colors can also be specified using RGB values, HEX values,
HSL values, RGBA values, and HSLA values.

The following three <div> elements have their background color set with RGB, HEX,
and HSL values:
Thank
You

You might also like