1 / 22

HTML

HTML. Hypertext Markup Language Possess the ability to link to documents Define properties (text, graphics) HTML XML XHTML MathML DHTML. HTML. Basically a text document Text editor Windows Notepad Web authoring tools Adobe Dreamweaver Microsoft Expression Web. Tags.

jordan-morales
Download Presentation

HTML

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. HTML • Hypertext Markup Language • Possess the ability to link to documents • Define properties (text, graphics) • HTML XML XHTML MathML DHTML

  2. HTML • Basically a text document • Text editor • Windows Notepad • Web authoring tools • Adobe Dreamweaver • Microsoft Expression Web

  3. Tags • Define appearance and properties in a web page • HTML tags are enclosed in <CODE> • <B>Tags</B> Tags • <I>Tags</I> Tags • <U>Tags</U> Tags

  4. Structure <HTML> <HEAD> <TITLE>…</TITLE> </HEAD> <BODY>…</BODY> </HTML>

  5. HTML <HEAD>…</HEAD> Mainly contain documents’ titles, and information describing properties of documents <BODY>…</BODY> contain main content of documents and tags

  6. Heading Tags • Used for setting section headers • Always in bold • <H1>…</H1> tags define the largest heading • <H6>…</H6> tags define the smallest heading • Extra line of spacing is added automatically before and after each heading

  7. Paragraphing Tags • Paragraph Taps • <P>…</P> defines a new paragraph • Extra line of spacing is added automatically before and after each paragraph

  8. Paragraphing Tags • Line Break Tag • <BR> defines a start on the new line • Put after the line as a break where you wish to start on a new line

  9. Paragraphing Tags • Preformatted Text Tags • <PRE>…</PRE> displays how you type a block of text in an HTML document • Extra spaces and line breaks can be displayed exactly as what you wrote

  10. Centre Tags • <CENTER>…</CENTER> are used to place elements within to the centre of the line in the browser window

  11. Horizontal Rule Tag • <HR> defines a horizontal rule • Useful for dividing a web page visually into several sections • Extra line of spacing is added automatically before and after each horizontal rule

  12. Comment Tags • <!--…--> • Comments written within are ignored and would not be displayed in the browser window

  13. Text Formatting Tags • <B>Tags</B> Tags • <I>Tags</I> Tags • <U>Tags</U> Tags • <SUP>Tags</SUP> Tags • <SUB>Tags</SUB> Tags • <B><I><U><SUB>TAGS</SUB></U></I></B> TAGS

  14. Font Tags • Font Size • <FONT size=“1”>…</FONT> smallest • <FONT size=“3”>…</FONT> default • <FONT size=“7”>…</FONT> largest

  15. Font Tags • Font Face • <FONT face=“Times New Roman”>Arial</FONT> Arial • <FONT face=“Arial”>Arial</FONT> Arial • <FONT face=“Arial Black”>Arial</FONT> Arial • Specified font must have been installed in visitors’ computers or else the text will not be displayed in that typefaces accordingly

  16. Font Color <FONT color=“green”>Arial</FONT> <FONT color=“#808080”>Arial</FONT> <FONT color=“FE0AB7”>Arial</FONT> <FONT size=“3” face=“Verdana” color=“red”>Z</FONT> Z Arial Arial Arial Font Tags

  17. Alignment Setting • Font Face • <P align=“left”> x2+2x+3=2 • <P align=“center”> x3+x2+2x+2=0 • <P align=“right”> x999-x998+x997-x996=x995 • x2+2x+3=2 • x3+x2+2x+2=0 • x999-x998+x997-x996=x995 • The default alignment setting is left-aligned

  18. Ordered List <OL> <LI>x+y</LI> <LI>f+b</LI> <LI>a+c</LI> <LI>zzz</LI> <LI>q-4r</LI> <LI>P65</LI> </OL> 1. x+y 2. f+b 3. a+c 4. zzz 5. q-4r 6. P65 Listing Tags

  19. Unordered List <UL> <LI>x+y</LI> <LI>f+b</LI> <LI>a+c</LI> <LI>zzz</LI> <LI>q-4r</LI> <LI>P65</LI> </UL> x+y f+b a+c zzz q-4r P65 Listing Tags

  20. Table Tags <TABLE>…</TABLE> <TR>…</TR> <TH>…</TH> <TD>…</TD> <TABLE> <TR><TH>Food</TH><TH>Price($)</TH></TR> <TR><TD>Steak</TD><TD>50</TD></TR> <TR><TD>Rice</TD><TD>8</TD></TR> <TR><TD>Strawberry</TD><TD>31</TD></TR> Define a table Define a table row Define a table header Define a table cell Listing Tags

  21. Images • Background Image • <BODY background=“netherlands.jpg” • Inline Image • <IMG src=“modernchina.jpg”>

  22. Hyperlinks • Allow uses to jump from one web page to another • Can be built on text, images and animation

More Related