Code Snippet Files

Demo


Code

HTML Code Page 1

For offical information about html code go to
The World Wide Web Consortium (W3C)
The text below is a quote from their website.
What is HTML?
HTML is the lingua franca for publishing hypertext on the World Wide Web.  It is a non-proprietary format based upon SGML, and can be created and processed by a wide range of tools, from simple plain text editors - you type it in from scratch - to sophisticated WYSIWYG authoring tools.  HTML uses tags such as <h1> and </h1> to structure text into headings, paragraphs, lists, hypertext links etc.
Here is a 10-minute guide for newcomers to HTML.

W3C's statement of direction for HTML is given on the HTML Activity Statement.  See also the page on our work on the next generation of Web forms, and the section on Web history.

lingua franca (Yeah, I had to look it up too.)
NOUN:
A medium of communication between peoples of different languages.  A mixture of Italian with Provençal, French, Spanish, Arabic, Greek, and Turkish, formerly spoken on the eastern Mediterranean coast.

HTML Code to create a web page that your browser can open and read.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="en-us" />
<title>Home Page of WWD Code Snippet Examples</title>
<meta name="description" content="Home Page of WWD Code Snippet Examples." />
<meta name="keywords" content="code,html,php,example,snippet,demonstration,demo,drop,down,list,US,states,forms" />
<meta name="robots" content="index,follow" />
<meta name="author" content="Vern Southern" />
<meta name="generator" content="Winning Web Designers (http://winningwebdesigners.com)" />
</head>
<body>
<p>Put your html code and content here.</p>
</body>
</html>
Copy the above code to ("Note Pad") in windows then save the file with a .html extention like this: (filename.html) then with Internet Explorer click (File, Open, Browse and select filename.html).
Note: Do not copy the code to a word processor like (MS Word) or (Word Pad).

Basic HTML Code

<p>Paragraph</p> Separates Paragraphs.

<b>Bold</b> = Bold

<i>Italic</i> = Italic

<u>Underline</u> = Underline

<b><i><u>Use them in any combination.</u></i></b> = Use them in any combination.

<br> Starts text on the next line.

<a href="http://www.yoursite.com">My Website</a> Makes a Hyperlink My Website

<a href="mailto:youremail@yoursite.com">Send E-mail</a> Makes a E-mail link Send E-mail

<center>Center The Text</center>

<h1>Heading 1</h1>


<h2 align="center">Heading 2</h2>

Heading 2

<h3>Heading 3</h3>

<h4>Heading 4</h4>

<h5>Heading 5</h5>
<h6>Heading 6</h6>
<img src="wwd.png" alt="image" width="75" height="75" border="0">

Inserts an image image



<ul>
<li>Bullet 1</li>
<li>Bullet 2</li>
<li>Bullet 3</li>
</ul>

Creates a bullet list.
  • Bullet 1
  • Bullet 2
  • Bullet 3


<ol>
<li>Something heard</li>
<li>Something else</li>
<li>Something done</li>
</ol>

Creates an organized list.
  1. Something heard
  2. Something else
  3. Something done


How To Make A Box

Example Code:

<div style="width: 468px; padding: 0px; border: 1px solid black;">
<div style="padding: 5px; border: 1px solid black; font-size: 20px; text-align: center; color: blue; background-color: red;">
Put Title Here
</div>
<div style="font-size: 16px; padding: 10px; text-align: left; color: black; background-color: yellow; border: 1px solid black;">
Put your text here.<br><br>Try these colors - black, red, green, brown, blue, magenta, cyan, gray (or grey), orange, brightgreen, yellow, brightblue, brightmagenta, brightcyan, white, trueblack, purple, silver, maroon, fuchsia, lime, olive, navy, teal, aqua. </div>
</div>

The HTML Code above makes the box below.

Put Title Here
Put your text here.

Try these colors - black, red, green, brown, blue, magenta, cyan, gray (or grey), orange, brightgreen, yellow, brightblue, brightmagenta, brightcyan, white, trueblack, purple, silver, maroon, fuchsia, lime, olive, navy, teal, aqua.


Browser Buttons

Example Code:

<form>
<input type="button" value="Back" onclick="history.back()">
</form>
<form>
<input type="button" value="Forward" onclick="history.forward()">
</form>
<form>
<input type="button" value="Reload" onclick="location.reload()">
</form>


I found this button at http://www.dynamicdrive.com/

Example Code:

<script>
/*
Back home button-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/

function gohome(){
if (document.layers)
window.home()
else if (document.all)
window.location="about:home"
else
alert("You need NS 4+ or IE 4+ to go back home!")
}
</script>

<form>
<input type="button" onClick="gohome()" value="Home">
</form>

<!--if you wish to use an image instead of a form button, uncomment this portion
<a href="javascript:gohome()"><img src="http://dynamicdrive.com/dynamic.gif"></a>
-->


Close Window Button

NOTE: If you press this button your Internet browser will close this web page.  If you want to test this button see the example below called "Pop-Up Window", it has a working example of the Close Window Button.

Example Code:

<form>
<input type="button" value="Close Window" onClick="javascript:window.close();">
</form>


Pop-Up Window

Open Pop-Up Window

Example Code:

<a href="javascript:void(0)" onclick="window.open('help_page.htm','miniwin','toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=1,resizable=0,width=400,height=225')"><b>Open Pop-Up Window</b></a>

Note: If you want to save the file used in this example Click Here and then select [File] [Save As].  Be sure that it is saved with the name [help_page.htm].


Radio Buttons

Single
Married
Separated
Divorced
Widowed
Prefer not to answer

Example Code:

<input type="radio" name="MaritalStatus" value="Single">Single<br />
<input type="radio" checked="checked" name="MaritalStatus" value="Married">Married<br />
<input type="radio" name="MaritalStatus" value="Separated">Separated<br />
<input type="radio" name="MaritalStatus" value="Divorced">Divorced<br />
<input type="radio" name="MaritalStatus" value="Widowed">Widowed<br />
<input type="radio" name="MaritalStatus" value="Prefer not to answer">Prefer not to answer<br />

Scrolling <DIV></DIV>

6. Release Of Liability
A. the party of the first part does hereby hold the party of the second part harmless with respect to any claims, loss, suit, liability or judgment suffered by the party of the first part, and for valuable consideration, the receipt and sufficiency of which is hereby acknowledged by the party of the first part, does hereby remise, release, and forever discharge the party of the second part, the party of the second part's heirs, executors, administrators and personal representatives from any and from all liability, and all manner of, actions, causes of action, suits, proceedings, debts, dues, contracts, judgments, damages, claims, and demands whatsoever in law or equity, including reasonable attorney's fees and costs, based upon or related to any item prepared by the party of the second part or at the party of the second part's direction, including, but not limited to, any claim of libel, slander, piracy, plagiarism, invasion of privacy, or infringement of copyright or other intellectual property interest, which the party of the second part ever had, now has, or which the party of the second part's heirs, executors, administrators or personal representatives hereafter can, shall, or may have for or by reason of any matter, cause, or thing whatsoever, from the beginning of the world to the end of time.

B. Furthermore, it is the purpose and intent of the executers of this instrument that sub-section 6.A above shall be interpreted by any State Court of competent jurisdiction in the most expansive and far-reaching terms conceivable.

Example Code:

<div style="width:468px; height:200px; background-color:#E2E2E2; overflow:auto;">
ENTER YOUR TEXT HERE.
</div>

Happy Computing :) - Vern Southern