Skip to main content

html frames and frameset tag

 HTML frames were a feature that allowed developers to divide a web page into multiple sections, each of which could load a separate HTML document. While frames were widely used in the past, they have now largely been replaced by modern web development techniques, such as CSS layout, which offer more control over page layout and are more compatible with modern browsers. Nonetheless, for the sake of completeness, let's dive into frames.

Frame and frameset tag
frames using html


There are three main parts to using frames in HTML: defining the frameset, defining the frames, and defining the content that will be loaded into each frame.

Defining the Frameset:

  1. The frameset defines the overall layout of the frames. It is defined using the <frameset> tag and specifies the number and layout of frames using the cols or rows attribute. Here is an example of a frameset that divides the page into two vertical frame:

<!DOCTYPE html>
<html>
<head>
<title>My Frameset</title>
</head>
<frameset cols="30%, 70%">
<frame src="leftframe.html" name="left">
<frame src="rightframe.html" name="right">
</frameset>
</html>

  1. In the above example, the cols attribute is used to specify that the page should be divided into two frames, with the left frame occupying 30% of the page width and the right frame occupying 70% of the page width. The frame tags define the content that will be loaded into each frame, with the src attribute specifying the URL of the HTML document to be loaded, and the name attribute specifying the name of the frame.

Defining the Frames:

  1. The frame tag is used to define each individual frame within the frameset. Each frame tag must have a src attribute, which specifies the URL of the HTML document to be loaded into that frame. The name attribute is used to give the frame a name, which can be used to target the frame from other parts of the HTML document or from JavaScript code.

<frame src="leftframe.html" name="left">
<frame src="rightframe.html" name="right">

In the above example, we define two frames named "left" and "right" and specify the URLs of the HTML documents to be loaded into each frame.

Defining the Content:

  1. The content to be loaded into each frame is specified using regular HTML documents, just like any other web page. Each HTML document must have a <head> and <body> section, just like a regular HTML document.

For example, the leftframe.html document might look something like this:

<!DOCTYPE html>
<html>
<head>
<title>Left Frame</title>
</head>
<body>
<h1>This is the left frame</h1>
<p>Some content goes here...</p>
</body>
</html>

Similarly, the rightframe.html document might look something like this:

<!DOCTYPE html>
<html>
<head>
<title>Right Frame</title>
</head>
<body>
<h1>This is the right frame</h1>
<p>Some content goes here...</p>
</body>
</html>

With all of these parts in place, the browser will display the frameset, dividing the page into two frames according to the specified layout, and loading the content from the specified HTML documents into each frame.


Comments

Popular posts from this blog

leetcode 48 solution

  48 .  Rotate Image You are given an  n x n  2D  matrix  representing an image, rotate the image by  90  degrees (clockwise). You have to rotate the image  in-place , which means you have to modify the input 2D matrix directly.  DO NOT  allocate another 2D matrix and do the rotation.   Example 1: Input: matrix = [[1,2,3],[4,5,6],[7,8,9]] Output: [[7,4,1],[8,5,2],[9,6,3]] Example 2: Input: matrix = [[5,1,9,11],[2,4,8,10],[13,3,6,7],[15,14,12,16]] Output: [[15,13,2,5],[14,3,4,1],[12,6,8,9],[16,7,10,11]]   Constraints: n == matrix.length == matrix[i].length 1 <= n <= 20 -1000 <= matrix[i][j] <= 1000 solution: class Solution { public:     void swap(int& a , int &b)     {         int c ;         c = a;         a = b;         b = c;     }     void transpose (vector<vector<int>...

Regular Expression Matching Leetcode Solution

Regular Expression Matching Given an input string s and a pattern p, implement regular expression matching with support for '.' and '*' where: '.' Matches any single character.​​​​ '*' Matches zero or more of the preceding element. The matching should cover the entire input string (not partial). Example 1: Input: s = "aa", p = "a"  Output: false  Explanation: "a" does not match the entire string "aa". Example 2: Input: s = "aa", p = "a*"  Output: true  Explanation: '*' means zero or more of the preceding element, 'a'. Therefore, by repeating 'a' once, it becomes "aa". Example 3: Input: s = "ab", p = ".*"  Output: true  Explanation: ".*" means "zero or more (*) of any character (.)". Constraints: 1 <= s.length <= 20 1 <= p.length <= 20 s contains only lowercase English letters. p contains only lowercase Englis...

2485. Find the Pivot Integer | Binary search

  Given a positive integer   n , find the   pivot integer   x   such that: The sum of all elements between  1  and  x  inclusively equals the sum of all elements between  x  and  n  inclusively. Return  the pivot integer  x . If no such integer exists, return  -1 . It is guaranteed that there will be at most one pivot index for the given input.   Example 1: Input: n = 8 Output: 6 Explanation: 6 is the pivot integer since: 1 + 2 + 3 + 4 + 5 + 6 = 6 + 7 + 8 = 21. Example 2: Input: n = 1 Output: 1 Explanation: 1 is the pivot integer since: 1 = 1. Example 3: Input: n = 4 Output: -1 Explanation: It can be proved that no such integer exist.   Constraints: 1 <= n <= 1000 Solution : class Solution { publ ic:     int pivotInteger( int n ) {         int sum = (( n )*( n + 1 ))/ 2 ;         int i = 1 ;         int j =...