Know about Technology!

Responsive Ads Here

Saturday, February 10, 2018

How to Create Web Layouts Using Html Frameset

Create Website Layout Using Html Frameset

Introductions :

It is very hard to create Html Layout using Tables and CSS because it consists of ideology. Without knowing the full function of Table and CSS, we can't create a perfect layout for our website. But with Frameset Tag, we can easily create website layout.  In the olden days, almost every web developers where chooses Frameset Tag to create their website layout. Today on this article you are going to learn about creating a website layout using Frameset Html.
How to Create a Website Layout Using Frameset Html Tag :
It is very easy to create website layout using Html Tag . Before getting in to the tutorial you need to know about website layouts . By viewing the below picture representation you can simply understand what is Layout of a Website .
Html Frameset Model
I hope you got an idea about what is Frameset, Now you are going to learn about Frameset in detail on the below paragraph. Follow the rules and regulation that given below . Step by Step process will help you fast learning .
  • Create a page name "home.html" and copy paste the below Html code to it.
<frameset rows="25%,25%">
  <frame src="header.html">
<frameset cols="25%,25%">
  <frame src="sidebar.html">
  <frame src="main.html" name="main">
</frameset>
  </frameset>
  • Replace the "header.html" With the header Html page you created.
  • Replace the "sidebar.html" With the Sidebar Html Page you created.
  • Replace the "main.html" With the page which you want to show on the "Main" Area .
  • Don't forget every "Html Pages" Must be placed inside one folder.  Other wise it will not work correctly.
  • You can change the "Frame" Size by changing the "rows or cols % rate".
  • You can change the "Frame" Position by changing the "<frame src="frame.html">" Position. 

Sidebar Page Setting :

Sidebar page must be configure other wise the link action will take place inside through the Sidebar Page itself . When a user click on the Sidebar Page link , The result must be shown inside through the "Main.html" Window. For the action, we already named the "Main.html" Page as "main" using the "Name" Tag. When you make a link on the "sidebar.html" Page the link must be "Target" With "Name" Tag "ID". Like the below example.
  • <a href="about.html"target="main">About Me</a> .
  • By using the above example. The link was targeted to "main.html" Page using "Target" Tag. 
  • When a user clicks on the link which appear on the sidebar . The result of the click action will passes to "main.html" Page using the "Target" Tag .
Remember the Frameset tag will not work on Html 5 Version . I already mentioned that on the Introduction . If your coding language is Html 5 Then use the CSS function to create Layout of the website . 

No comments:

Post a Comment