Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

HTML Introduction

1,671 views

Published on

Published in: Education, Technology, Design
  • Be the first to comment

  • Be the first to like this

HTML Introduction

  1. 1. Hypertext Markup Language The Building Blocks of Webpages
  2. 2. Tags <ul><li>Tags are contained in < > and contains words that resemble what they do. </li></ul><ul><ul><ul><li><p> = create a paragraph </li></ul></ul></ul><ul><ul><ul><li><b> = bold </li></ul></ul></ul><ul><li>For every tag you open you need to close it. </li></ul><ul><ul><ul><li><p> open paragraph <b> start bold </li></ul></ul></ul><ul><ul><ul><li></p> close paragraph </b> end bold </li></ul></ul></ul>
  3. 3. Building the Page <html> <head> <body> This is the first tag you use to tell the Internet Browser what code you are using. The tag is use to add all the ‘thinking’ code, code that doesn’t necessarily change the way the page looks The tag is used to change the way the page looks
  4. 4. A Basic Page <ul><li><html> </li></ul><ul><li><head> </li></ul><ul><li></head> </li></ul><ul><li><body> </li></ul><ul><li><p> This is my first page </p> </li></ul><ul><li></body> </li></ul><ul><li></html> </li></ul>Try out this code in NotePad! Save the page as “ My First Page.html”
  5. 5. Advanced Tags <ul><li>Some tags can have properties inside them. </li></ul><ul><ul><ul><li><font color=“red” align=“center” >Font</font> </li></ul></ul></ul><ul><ul><ul><li><img src=“picture.jpg” > </li></ul></ul></ul><ul><ul><ul><li><a href=“http://www.yahoo.co.uk” >Yahoo</a> </li></ul></ul></ul><ul><ul><ul><li><body bgcolor=“orange” > </li></ul></ul></ul>NOTE The <img> tag does not need to be closed
  6. 6. Important to Remember <ul><li>You need to save the pages Name .html otherwise the browser will not know it is a webpage </li></ul><ul><li>All the code has American spelling. </li></ul><ul><li>c o l o u r is spelt color </li></ul>

×