So well,
I’m back again. But this time, not to explain anything.
As I had mentioned before, I’m working on a website.
Please try and open the link on either Google Chrome or Safari. Delhi Walle
For IE users, you won’t get to see all the animation.
Now. This website is for a restaurant near my house.It might not look great as I am still working on it.
Please check it out 🙂
Yes. I’m back!
I’ve been working on http://delhiwalle.in
Its not great but it’s taken alot of hard work.
Now, the real feel of the website comes through Chrome, Firefox, And Safari.
This is supposed to be a sample program so here goes:
<html>
<head>
<style type=”text/css”>
<html>
<head>
<style type=”text/css”>
body {
font-family: “Monotype Corsiva”;
background-color: red;
color: black;
}
#one{
border: solid blue;
background: red;
font-family: Harlow Solid Italic;
padding= 5px 10px 5px 10px;
}
#two{
border: solid dark blue;
background: yellow;
font-family: Algerian;
padding= 5px 10px 5px 10px;
fontweight=500;
}
table {
font-family: “Chiller”;
font-weight: 900;
color: red;
background-color: black;
border: 4px dotted white;
}
</style>
</head>
<body>
<div id=”one”>
<legend>  Please login:</legend>
<div id=”two”>
 <table>
<tr>
<td> UserName: </td>
<td> <input type=”text” size=”15″> </td>
</tr>
<tr> 
<td> Password: </td>
<td><input type=”password” size=”15″> </td>
</tr>
</table><br>
<input type=”Submit” value=”Submit”>
 <input type=”Reset” value=”Reset”><br>
</div>
</div>
<br><br>
</div>
</body>
</html>
Save it as Trial.html OR Trial.htm
The div tag stand for divison and is used as <div> xyz </div>
Now look at the facebook page, www.facebook.com, If you see the top blue part, and the rest of the body, these are two separate divisions.
<div id = one>
THIS IS A DIVISION
</div>
On your CSS page, you type in the following code
#one{
}
And customize the divison to your liking.
You can also put a div inside a div.
<div id= one>
Welcome
<div id= two>
Hi!
</div>
</div>
The ID attribute serves for the name of the division. You can call your division anything you like.
I will post a sample program soon! Until then, keep practising! 🙂
So basically, CSS is incorporated in html.
it has predefined tags, like, it basically knows what the body tag is.
so if you do
body{
background: black;
}
It will make the background black. Of course the syntax is
<style type=”text/css”>
body{
}
table{
}
</style>
Technically any html tag can be completely customized. So, your body automatically becomes black and you dont have to type in the bgcolor attribute.
The basic attributes are:
background: BACKGROUNDCOLORNAMEHERE;
color: TEXTCOLORNAMEHERE;
font-family: FONTNAMEHERE;
border: double/dotted COLOR NAME;
font-size: FONTSIZEHERE; eg 12pt;
padding: 4px 4px 4px 75px; (Just use this, it’s generally the best dimensions);
These are a few of the basic attributes that can be used for each of the tags.
Next post (which will be in a while) will be related to division tags <div> (V V IMPORTANT)
Sorry guys. I really haven’t been free lately. School has started for me and I need to finish A LOT of work. But , I will try to update my blog every weekend. So stay tuned till then. Sorry.
CSS using cooltext.com
Yes! We’re finally here!
Tired of using font tags every where? Well. CSS sure will save you. This is probably the most convenient and easiest way to change fonts and backgrounds; technically whatever you want on your page.
You can customize fonts and borders, align text etc.
Basically, you just have to incorporate it in your HTML code. Sounds complicated? Not at all. All you have to do is:
<html>
<head>
<style type=”text/css”>
CSS CODE HERE
</style>
<title> IF NEEDED </title>
</head>
You can also always make a css document and import it. (I’ll explain that later)
And trust me, there isn’t much I have to explain. You’ve used the font tag. In CSS face becomes font-family and stuff like that. You’ll even understand the code. I’m posting a sample code. Check it out!
<html>
<head>
<style type=”text/css”>
body{
background: Black;
font-family: Algerian;
}
#main{
border: 5pt dotted green;
background: red;
}
#one{
border: 3pt double red;
background: yellow;
font-family: Chiller;
font-size: 40pt;
}
#two{
border: 3pt double black;
background: 3pt double red;
font-family: Algerian;
font-size: 30pt;
}
</style>
</head>
<body>
<div id=”main”>
<div id=”one”>
Watzowski Enterprise
<div id=”two”>
Welcome To Watzowski Enterprise
</div>
</div>
</div>
</body>
</html>
Save it as whatever you want and try it! 😀
I’ll explain my code in my next post!
Address Tag:
As the name suggests, it is used for indicating an address, usually related to authorship of the current document.
For example, if you want to give contact details for your organization, you would generally use the address tag.
Syntax: <address> Text Here </address>
Well. This is basically it. We’re pretty much done with the BASICS OF HTML
Guys. This is a big program. 4 html pages.
First Page:
<html>
<frameset rows=”20%,80%” noresize>
<frame src=”Head.html” name=”Head”>
<frame src=”Home.html” name=”Main”>
</frameset>
</html>
Save the above program as “Index.html”
Second Page:
<html>
<body bgcolor=”black” text=”red”>
<font face=”Algerian” size=7><h1><u><center> Trial
</u></font></h1></center><hr>
<center> <a href=”Home.html” target=”Main”> Home </a>
<a href=”AboutUs.html” target=”Main”> About Us </a>
</body>
</html>
Save the above page as “Head.html”
Third Page:
<html>
<body bgcolor=”red”>
<center><font face=”chiller” size=6> <u> <b> Home </u> </b>
</font> <br><br> <font face=”
<p> This is the home page! <br><hr><br>
If you notice the code for <b> “Head.html” </b> You will see
that there is a <b> “Target” </b> Attribute. <br>
This tag basically specifies where the page will open. (The
current frameset had two parts: <b> Main and Head. </b>
(Index.html (Name attribute)) <br>
When we put target to <b> “Main” </b> It opened up in the
“Main” frame.</p> <br>
The “p” tag helps you write a paragraph.
<hr>
</center>
</body>
</html>
Save the above program as “Home.html”
Forth Page:
<html>
<body bgcolor=”red”>
<h1><center><u> ABOUT US </u></h1></center><br><br>
<center>This is a trial program.
</center>
</body>
</html>
Save the above program as “AboutUs.html”
IMPORTANT: LOOK AT HOME.HTML
Sorry guys.
I havent added a new post for 2 days. I have been extremely busy. And I cant add a post right now as I have an extremely important game to catch! My Indian followers – you know what I’m talking about! IPL! I will post a sample program tomorrow. On the bright side, we’re almost done with the basics of HTML. We can now move on to CSS. =]
The <frameset> tag helps to split your screen into two parts.
For this, you usually have to make three html pages.
Its simple. First, You have to decide wether you want the page divided as rows or as columns.
<frameset rows=”25%,75%”>
<frame src=”Links.html” name=”Links”>
<frame src=”Main.html” name=”Main”>
</frameset>
On launching the above program, a page with two rows will open.
You also usually add the <frameset rows=” ” noresize> Element to prevent the user from fiddling around with the frameset.
You will also have to make two separate pages in the same folder, with names that will go in the src attribute.
If you have any questions look at http://www.w3schools.com/tags/tag_frameset.asp
I will also post a sample program. That should explain things further. But as we go ahead, you will see that frameset is not used anywhere. We normally use div tags. But for now, lets just stick to this.
