Getting Started
When you create an html document the first thing you should do is put the <html> tag which means that you are starting your html document. Next usually but not always comes the <body> tag. Then you can put what you want like the <p> tag,The <b> tag,The <a> tag and others.After that usually but not always (again) you put the ending tag for <body> but instead of putting the <body> tag put the </body> Tag. The ending tags always start with the </ sign instead of the < sign. Unless they don't have an ending tag like <br>(line break). And finally put the ending tag for <html> (</html). Now your ready start making your webpage rock!
Css
You can also use Cascading Style Sheets (Css) in your Html or (X)Html which will help you put more style into your web page. The example of Css below is a handy thing to know when you need to change that boring white background.This example tells the browser to display a red background. If you don't want to use red change the hex color(recommended) or just put a space and a color name like red,orange,blue etc.Or if you just want some text to have a background and not the whole page you can go to my website (htmlguy.yolasite.com) and select Css. There you can learn a lot of Css. Css is used for a lot of things but will never work if you don't tell the browser when it is going to display Css and when is it is going to stop displaying Css. To tell the browser it is going to display Css you put <style type="text/css">. To tell the browser that it is going to stop displaying Css put </style> . For a lot more css and html visit www.htmlguy.yolasite.com.
<head>
<style type="text/css">
body {background-color:#FF0000}
p {margin-left: 20px}
</style>
</head>
Copy Button
Have you ever seen those buttons that you press and then click,it's copied and wanted to make your own? Now You Can by entering:
<SPAN ID="copytext" STYLE="height:150;width:162;background-color:#FFFFFF">
This text will be copied onto the clipboard when you click the button below. Try it!
</SPAN>
<TEXTAREA ID="holdtext" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="ClipBoard();">Copy</BUTTON>
<SCRIPT LANGUAGE="JavaScript">
function ClipBoard()
{
holdtext.innerText = copytext.innerText;
Copied = holdtext.createTextRange();
Copied.execCommand("Copy");
}
</SCRIPT>
Replace the text in betweeen SPAN ID and The ending SPAN code. You can also replace the background color for the text. The default background color set is white. To change it go into the SPAN ID chage the hex color or put an rgb value or a color name followed by a space.
Add a sharing button
The most used and most recommended sharing service is addthis. You can visit them at www.addthis.com You can make your own button at http://tinyurl.com/93434p or http://www.addthis.com/web-button-select Here are some codes:
The classic:
<!-- AddThis Button BEGIN -->
<a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&username=xa-4b3cee853ff343fd"><img src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4b3cee853ff343fd"></script>
<!-- AddThis Button END -->
The Fancy one:
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&username=xa-4b3cf0de13b8714d" class="addthis_button_compact">Share</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_myspace"></a>
<a class="addthis_button_google"></a>
<a class="addthis_button_twitter"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4b3cf0de13b8714d"></script>
<!-- AddThis Button END -->
Popups and Alerts
To make a button that opens an alert use this code:
<html>
<head>
<script type="text/javascript">
function show_alert()
{
alert("Hello! I am an alert box!");
}
</script>
</head>
<body>
<input type="button" onclick="show_alert()" value="Show alert box" />
</body>
</html>
Change the hello I am an alert box to the text that you want to show up and the value of Show alert box to what you want.
The code for popups is:
<head>
<script type="text/javascript">
<!--
function myPopup() {
window.open( "http://www.google.com/" )
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onClick="myPopup()" value="Press here for a google popup!">
</form>
And finally the most used and famous the automatic popup code:
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=500,height=300,left = 487,top = 275');");
}
// End -->
</script>
<BODY onLoad="javascript:popUp('http://www.google.com/')">
When you create an html document the first thing you should do is put the <html> tag which means that you are starting your html document. Next usually but not always comes the <body> tag. Then you can put what you want like the <p> tag,The <b> tag,The <a> tag and others.After that usually but not always (again) you put the ending tag for <body> but instead of putting the <body> tag put the </body> Tag. The ending tags always start with the </ sign instead of the < sign. Unless they don't have an ending tag like <br>(line break). And finally put the ending tag for <html> (</html). Now your ready start making your webpage rock!
Css
You can also use Cascading Style Sheets (Css) in your Html or (X)Html which will help you put more style into your web page. The example of Css below is a handy thing to know when you need to change that boring white background.This example tells the browser to display a red background. If you don't want to use red change the hex color(recommended) or just put a space and a color name like red,orange,blue etc.Or if you just want some text to have a background and not the whole page you can go to my website (htmlguy.yolasite.com) and select Css. There you can learn a lot of Css. Css is used for a lot of things but will never work if you don't tell the browser when it is going to display Css and when is it is going to stop displaying Css. To tell the browser it is going to display Css you put <style type="text/css">. To tell the browser that it is going to stop displaying Css put </style> . For a lot more css and html visit www.htmlguy.yolasite.com.
<head>
<style type="text/css">
body {background-color:#FF0000}
p {margin-left: 20px}
</style>
</head>
Copy Button
Have you ever seen those buttons that you press and then click,it's copied and wanted to make your own? Now You Can by entering:
<SPAN ID="copytext" STYLE="height:150;width:162;background-color:#FFFFFF">
This text will be copied onto the clipboard when you click the button below. Try it!
</SPAN>
<TEXTAREA ID="holdtext" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="ClipBoard();">Copy</BUTTON>
<SCRIPT LANGUAGE="JavaScript">
function ClipBoard()
{
holdtext.innerText = copytext.innerText;
Copied = holdtext.createTextRange();
Copied.execCommand("Copy");
}
</SCRIPT>
Replace the text in betweeen SPAN ID and The ending SPAN code. You can also replace the background color for the text. The default background color set is white. To change it go into the SPAN ID chage the hex color or put an rgb value or a color name followed by a space.
Add a sharing button
The most used and most recommended sharing service is addthis. You can visit them at www.addthis.com You can make your own button at http://tinyurl.com/93434p or http://www.addthis.com/web-button-select Here are some codes:
The classic:
<!-- AddThis Button BEGIN -->
<a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&username=xa-4b3cee853ff343fd"><img src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4b3cee853ff343fd"></script>
<!-- AddThis Button END -->
The Fancy one:
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&username=xa-4b3cf0de13b8714d" class="addthis_button_compact">Share</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_myspace"></a>
<a class="addthis_button_google"></a>
<a class="addthis_button_twitter"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4b3cf0de13b8714d"></script>
<!-- AddThis Button END -->
Popups and Alerts
To make a button that opens an alert use this code:
<html>
<head>
<script type="text/javascript">
function show_alert()
{
alert("Hello! I am an alert box!");
}
</script>
</head>
<body>
<input type="button" onclick="show_alert()" value="Show alert box" />
</body>
</html>
Change the hello I am an alert box to the text that you want to show up and the value of Show alert box to what you want.
The code for popups is:
<head>
<script type="text/javascript">
<!--
function myPopup() {
window.open( "http://www.google.com/" )
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onClick="myPopup()" value="Press here for a google popup!">
</form>
And finally the most used and famous the automatic popup code:
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=500,height=300,left = 487,top = 275');");
}
// End -->
</script>
<BODY onLoad="javascript:popUp('http://www.google.com/')">
