1 / 16

HTML Hyper Text Markup Language

HTML Hyper Text Markup Language. Contents. Introduction What is HTML HTML Basic Contents HTML Phases Tags Properties Image Integration Forms. What is HTML ?. H-T-M-L are initials that stand for Hyper Text Markup Language

cwilliam
Download Presentation

HTML Hyper Text Markup Language

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. HTMLHyper Text Markup Language

  2. Contents • Introduction • What is HTML • HTML Basic Contents • HTML Phases • Tags Properties • Image Integration • Forms

  3. What is HTML ? • H-T-M-L are initials that stand for Hyper Text Markup Language • Hyper is the opposite of linear. It used to be that computer programs had to move in a linear fashion. This before this, this before this, and so on. HTML does not hold to that pattern and allows the person viewing the World Wide Web page to go anywhere, any time they want. • Text is what you will use. Real, honest to goodness English letters. • Mark up is what you will do. You will write in plain English and then mark up what you wrote. More to come on that in the next Primer. • Language because they needed something that started with "L" to finish HTML and Hypertext Markup Louie didn't flow correctly. Because it's a language, really -- but the language is plain English.

  4. HTML Basic Contents HTML <body> <head> Web Page <table> <title> <meta>

  5. HTML Phases Phase 1 Phase 2 Phase 3 • <body> • <table> • <tr> <td></td> </tr> • </table> • </body> • <html> • <head> • <meta /> • <title></title> • </head> • <body> • </body> • </html> • <html> • <head> • <title></title> • </head> • <body> • </body> • </html>

  6. Tags Properties <table> <font> <img> <body> bgcolor="#FF9900" leftmargin="0" rightmargin="0" topmargin="0" text="#FFFFFF" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF" bgcolor="#FF9900" background=“url“ width="780“ Height=“400” border="0" face="Arial" color="#990000" size="+4“ Style=“css” src=“url“ align="left" border="0" height="50" width="50"

  7. Image Integration align src border <img> height / width title Example: <imgsrc="img/logo.jpg" align="middle" border="1" title="my logo" height="50" width="50" />

  8. Image with link "_blank" | "_parent" | "_self" | "_top" | window name target align src border href <a> <img> Height width title title • Example: • <a href=“page.htm” target="_parent" title="any"> • <imgsrc="img/logo.jpg"/> • </a>

  9. Forms

  10. Forms (input)

  11. Forms (text box) <input name="textfield" type="text" value="your name"/>

  12. Forms (text area) <textarea name="textfield9" rows="3"> </textarea>

  13. Forms (radio buttons) <input name="radio_male" type="radio" value="radiobutton" /> Male <input name="radio_female" type="radio" value="radiobutton" /> Female checked="checked"

  14. Forms (Check box) <input type="checkbox“ value="checkbox" /> Networking<br /> <input type="checkbox“ value="checkbox" />Web designing <br /> <input type="checkbox“ value="checkbox" /> Database checked="checked"

  15. Forms (Combo Box) <select name="state" id="state"> <OPTION VALUE=''> -- Please Select State -- <OPTION VALUE='AK'> AK <OPTION VALUE='AL' > AL <OPTION VALUE='AR' > AR <OPTION VALUE='AZ' > AZ <OPTION VALUE='CA' > CA <OPTION VALUE='CO' > CO <OPTION VALUE='CT' > CT <OPTION VALUE='DC' > DC <OPTION VALUE='WY' > WY </select>

  16. Forms (buttons) <input name="Submit2" type="submit" value="Submit" /> <input name="Submit1" type=“reset" value=“Reset" />

More Related