User Tools

Site Tools


documentation:html

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
documentation:html [2010/05/20 05:58] triley2documentation:html [2010/05/20 07:45] (current) triley2
Line 1: Line 1:
 +<WRAP left 40%>
 +~~TOC~~
 +</WRAP>
 +//
 +//
 +<WRAP centeralign 100% bigger>
 +<WRAP bigger fgred>Lab46 Tutorials</WRAP>
 +<WRAP muchbigger>HTML</WRAP>
 +Hyper Text Markup Language
 +</WRAP>
 +<WRAP clear></WRAP>
 +HTML is a mark up language used for web page creation. It has been the standard for web development since the early 1990's. The current version is HTML 5.0 and still continues to be the standard. Using simple "tags" or opening and closing commands denoted as <tag> </tag>. A structured document can be created that can be veiwed on any common web browser. No special tools are needed except a text editor and a browser to edit and view the page respectively. 
  
 +===== First Web Page =====
 +<code html>
 +<html>
 +    <head>
 +        <title>My New Web Page</title>
 +    </head>
 +    <body>
 +        Hello world this is my new web page!
 +    </body>
 +</html>
 +</code>
 +
 +save as index.html
 +
 +to view open the file within your favorite web browser.
 +
 +===== Common Tags =====
 +  *main tags wraps whole page
 +<code html>
 +<html></html>
 +</code>
 +
 +  *header tags # is the nubbier header you want {1,2,3,4,5}
 +<code html>
 +<h#></h#>
 +</code>
 +
 +  *paragraph tags
 +<code html>
 +<p></p>
 +</code>
 +
 +  *anchor tags used for web links
 +<code html>
 +<a href""></a>
 +</code>
 +
 +  *wraps main content 
 +<code html>
 +<body></body>
 +</code>
 +
 +  *wraps page information {title, css}
 +<code html>
 +<head></head>
 +</code>
 +
 +  *wraps webpage title
 +<code html>
 +<title></title>
 +</code>
 +
 +  *inserts an image
 +<code html>
 +<img src="">
 +</code>
 +
 +  *wraps a portion of text for separation
 +<code html>
 +<span></span>
 +</code>
 +
 +  *line break
 +<code html>
 +<br/>
 +</code>
 +
 +  *comment tags 
 +<code html>
 +<!- ->
 +</code>
 +
 +  *used for linking webpages
 +<code html>
 +<link rel="" type="" href="" />
 +</code>
 +
 +  *divider tags 
 +<code html>
 +<div></div>
 +</code>
 +===== Example with more tags =====
 +<code html>
 +<html>
 +    <head>
 +        <title> This is my title </title>
 +    </head>
 +    <body>
 +        <h1> Big header </h1>
 +        <!- this is a comment ->
 +        <p>
 +            start of a new paragraph
 +            <br /> <!- line break ->
 +            <a href="www.google.com">GOOGLE</a>
 +            <!- a link to google -> 
 +        </p>
 +        <p>
 +            another paragraph with a picture
 +            <img src="picture.jpg">
 +        </p>
 +    </body>
 +<html>
 +</code>
 +
 +===== Links =====
 +  *www.w3schools.com