HTML
INTRODUCTION <ul><li>HTML stands for  Hyper Text Markup Language </li></ul><ul><li>predominant  markup language  for  web ...
HTML Tags <ul><li>HTML markup tags are usually called HTML tags </li></ul><ul><li>HTML tags are keywords surrounded by  an...
<ul><li>HTML Headings </li></ul><ul><li>HTML headings are defined with the <h1> to <h6> tags. </li></ul><ul><li>HTML Parag...
HTML Element <ul><li>An HTML element starts with a  start tag / opening tag  and ends with an  end tag / closing tag   </l...
HTML Attributes <ul><li>Attributes provide  additional information  about the element  </li></ul><ul><li>Attributes are al...
HTML Styles  <ul><li>Styles was introduced to style HTML elements using the style attribute, or indirectly in separate sty...
HTML Links  <ul><li>Link syntax: </li></ul><ul><li><a href=&quot;url&quot;>Link text</a>  </li></ul><ul><li>A hyperlink is...
HTML Images  <ul><li>In HTML, images are defined with the <img> tag.   </li></ul><ul><li>To display an image on a page, yo...
HTML Tables <ul><li>Tables are defined with the <table> tag. A table is divided into rows (with <tr> tag), and each row is...
HTML Lists <ul><li>Unordered Lists </li></ul><ul><li>An unordered list is a list of items marked with bullets. </li></ul><...
<ul><li>Ordered Lists </li></ul><ul><li>An ordered list is also a list of items marked with numbers. </li></ul><ul><li>An ...
<ul><li>Definition Lists </li></ul><ul><li>A definition list is not a list of single items. It is a list of items with a d...
HTML Forms and Input <ul><li>A form is an area that can contain form elements that allow the user to enter information (li...
HTML Colors  <ul><li>HTML colors are defined using a hexadecimal notation for the combination of Red, Green, and Blue colo...
HTML Frames <ul><li>With frames, we can display more than one HTML document in the same browser window. Each HTML document...
TAG DESCRIPTION <!--...--> Defines a comment <!DOCTYPE>   Defines the document type <a> Defines an anchor < abbr > Defines...
<caption> Defines a table caption <center> Deprecated.  Defines centered text <cite> Defines a citation <code> Defines com...
<h1> to <h6> Defines HTML headings <head> Defines information about the document <hr /> Defines a horizontal line <html> D...
< noscript > Defines an alternate content for users that do not support client-side scripts <object> Defines an embedded o...
<style> Defines style information for a document <sub> Defines subscripted text <sup> Defines superscripted text <table> D...
THANK YOU
Upcoming SlideShare
Loading in...5
×

Html

3,734

Published on

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,734
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
258
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Html

  1. 1. HTML
  2. 2. INTRODUCTION <ul><li>HTML stands for Hyper Text Markup Language </li></ul><ul><li>predominant markup language for web pages </li></ul><ul><li>Developed by World Wide Web Consortium & WHATWG </li></ul><ul><li>Type of format Markup language </li></ul>
  3. 3. HTML Tags <ul><li>HTML markup tags are usually called HTML tags </li></ul><ul><li>HTML tags are keywords surrounded by angle brackets like <html> </li></ul><ul><li>HTML tags normally come in pairs like <b> and </b> </li></ul><ul><li>The first tag in a pair is the start tag, the second tag is the end tag </li></ul><ul><li>Start and end tags are also called opening tags and closing tags </li></ul><ul><li>HTML tags are not case sensitive </li></ul>
  4. 4. <ul><li>HTML Headings </li></ul><ul><li>HTML headings are defined with the <h1> to <h6> tags. </li></ul><ul><li>HTML Paragraphs </li></ul><ul><li>HTML paragraphs are defined with the <p> tag. </li></ul><ul><li>HTML Links </li></ul><ul><li>HTML links are defined with the <a> tag. </li></ul><ul><li>HTML Images </li></ul><ul><li>HTML images are defined with the <img> tag. </li></ul><ul><li>HTML Comments </li></ul><ul><li>Comments can be inserted in the HTML code to make it more readable and understandable but they are ignored by the browser and are not displayed. </li></ul>
  5. 5. HTML Element <ul><li>An HTML element starts with a start tag / opening tag and ends with an end tag / closing tag </li></ul><ul><li>The element content is everything between the start and the end tag </li></ul><ul><li>Some HTML elements have empty content . Eg.line break </li></ul><ul><li>Empty elements are closed in the start tag </li></ul><ul><li>Most HTML elements can have attributes </li></ul>
  6. 6. HTML Attributes <ul><li>Attributes provide additional information about the element </li></ul><ul><li>Attributes are always specified in the start tag </li></ul><ul><li>Attributes come in name/value pairs like: name=&quot;value&quot; </li></ul><ul><li>HTML links are defined with the <a> tag. </li></ul><ul><li>Eg. <a href=&quot;http://www.w3schools.com&quot;>This is a link</a> </li></ul>
  7. 7. HTML Styles <ul><li>Styles was introduced to style HTML elements using the style attribute, or indirectly in separate style sheets (CSS) </li></ul><ul><li>Style Examples: </li></ul><ul><li>Background Color </li></ul><ul><li>Font Family, Color and Size </li></ul><ul><li>Text Alignment </li></ul>
  8. 8. HTML Links <ul><li>Link syntax: </li></ul><ul><li><a href=&quot;url&quot;>Link text</a> </li></ul><ul><li>A hyperlink is an address to a resource on the web. </li></ul><ul><li>An anchor is a term used to define a hyperlink destination inside a document. </li></ul><ul><li>The HTML anchor element <a>, is used to define both hyperlinks and anchors. </li></ul>
  9. 9. HTML Images <ul><li>In HTML, images are defined with the <img> tag.  </li></ul><ul><li>To display an image on a page, you need to use the src attribute. Src stands for &quot;source&quot;. The value of the src attribute is the URL of the image </li></ul><ul><li>The syntax of defining an image: </li></ul><ul><li><img src=&quot;url&quot; /> </li></ul><ul><li>The browser puts the image where the image tag occurs in the document. </li></ul><ul><li>The alt attribute is used to define an &quot;alternate text&quot; for an image. The &quot;alt&quot; attribute gives information of what is missing on a page if the browser can't load images. </li></ul>
  10. 10. HTML Tables <ul><li>Tables are defined with the <table> tag. A table is divided into rows (with <tr> tag), and each row is divided into data cells (with <td> tag) where td stands for &quot;table data,&quot; which is the content of a data cell. </li></ul><ul><li>Headings in a Table </li></ul><ul><li>Headings in a table are defined with the <th> tag. </li></ul>
  11. 11. HTML Lists <ul><li>Unordered Lists </li></ul><ul><li>An unordered list is a list of items marked with bullets. </li></ul><ul><li>An unordered list starts with the <ul> tag. Each list item starts with the <li> tag. </li></ul><ul><li><ul> <li>Coffee</li> </ul> </li></ul><ul><li>Coffee </li></ul>
  12. 12. <ul><li>Ordered Lists </li></ul><ul><li>An ordered list is also a list of items marked with numbers. </li></ul><ul><li>An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. </li></ul><ul><li><ol> <li>Coffee</li> </ol> </li></ul><ul><li>1.Coffee </li></ul>
  13. 13. <ul><li>Definition Lists </li></ul><ul><li>A definition list is not a list of single items. It is a list of items with a description of each item. </li></ul><ul><li>A definition list starts with a <dl> tag ( d efinition l ist). </li></ul><ul><li>Each term starts with a <dt> tag ( d efinition t erm). </li></ul><ul><li>Each description starts with a <dd> tag ( d efinition d escription). </li></ul><ul><li><dl> <dt>Coffee</dt> <dd>Black hot drink</dd> </dl> </li></ul><ul><li>Coffee </li></ul><ul><li>Black hot drink </li></ul>
  14. 14. HTML Forms and Input <ul><li>A form is an area that can contain form elements that allow the user to enter information (like text fields, textarea fields,radio buttons, checkboxes) in a form. </li></ul><ul><li>A form is defined with the <form> tag. </li></ul><ul><li>The most used form tag is the <input> tag. </li></ul><ul><li>When the user clicks on the &quot;Submit&quot; button, the content of the form is sent to the server. </li></ul>
  15. 15. HTML Colors <ul><li>HTML colors are defined using a hexadecimal notation for the combination of Red, Green, and Blue color values. </li></ul><ul><li>The lowest value to the light sources is 0 and highest value is 255. </li></ul><ul><li>Hex values are written as 3 double digit numbers, starting with a # sign. </li></ul><ul><li>It gives a total of more than 16 million different colors to play with (256 x 256 x 256). </li></ul>
  16. 16. HTML Frames <ul><li>With frames, we can display more than one HTML document in the same browser window. Each HTML document is called a frame, and each frame is independent of the others. </li></ul><ul><li>The <frameset> tag defines how to divide the window into frames </li></ul><ul><li>The <frame> tag defines what HTML document to put into each frame </li></ul><ul><li>The disadvantages of using frames are: </li></ul><ul><li>The web developer must keep track of more HTML documents </li></ul><ul><li>It is difficult to print the entire page </li></ul>
  17. 17. TAG DESCRIPTION <!--...--> Defines a comment <!DOCTYPE>   Defines the document type <a> Defines an anchor < abbr > Defines an abbreviation <acronym> Defines an acronym <address> Defines contact information for the author/owner of a document <applet> Deprecated. Defines an embedded applet <area /> Defines an area inside an image-map <b> Defines bold text <base /> Defines a default address or a default target for all links on a page < basefont /> Deprecated. Defines a default font, color, or size for the text in a page < bdo > Defines the text direction <big> Defines big text < blockquote > Defines a long quotation <body> Defines the document's body < br /> Defines a single line break STF <button> Defines a push button STF
  18. 18. <caption> Defines a table caption <center> Deprecated. Defines centered text <cite> Defines a citation <code> Defines computer code text < col /> Defines attribute values for one or more columns in a table  < colgroup > Defines a group of columns in a table for formatting < dd > Defines a description of a term in a definition list <del> Defines deleted text < dfn > Defines a definition term <dir> Deprecated. Defines a directory list <div> Defines a section in a document <dl> Defines a definition list < dt > Defines a term (an item) in a definition list < em > Defines emphasized text  < fieldset > Defines a border around elements in a form <font> Deprecated. Defines font, color, and size for text <form> Defines an HTML form for user input <frame /> Defines a window (a frame) in a frameset
  19. 19. <h1> to <h6> Defines HTML headings <head> Defines information about the document <hr /> Defines a horizontal line <html> Defines an HTML document <i> Defines italic text < iframe > Defines an inline frame < img /> Defines an image <input /> Defines an input control <ins> Defines inserted text <isindex> Deprecated. Defines a searchable index related to a document < kbd > Defines keyboard text <label> Defines a label for an input element <legend> Defines a caption for a fieldset element < li > Defines a list item <link /> Defines the relationship between a document and an external resource <map> Defines an image-map  <menu> Deprecated. Defines a menu list <meta /> Defines metadata about an HTML document < noframes > Defines an alternate content for users that do not support frames
  20. 20. < noscript > Defines an alternate content for users that do not support client-side scripts <object> Defines an embedded object < ol > Defines an ordered list < optgroup > Defines a group of related options in a select list <option> Defines an option in a select list <p> Defines a paragraph < param /> Defines a parameter for an object <pre> Defines preformatted text <q> Defines a short quotation <s> Deprecated. Defines strikethrough text < samp > Defines sample computer code <script> Defines a client-side script <select> Defines a select list (drop-down list) <small> Defines small text <span> Defines a section in a document <strike> Deprecated. Defines strikethrough text <strong> Defines strong text <sup> Defines superscripted text
  21. 21. <style> Defines style information for a document <sub> Defines subscripted text <sup> Defines superscripted text <table> Defines a table < tbody > Groups the body content in a table <td> Defines a cell in a table < textarea > Defines a multi-line text input control < tfoot > Groups the footer content in a table < th > Defines a header cell in a table <thead> Groups the header content in a table <title> Defines the title of a document <tr> Defines a row in a table <tt> Defines teletype text <u> Deprecated. Defines underlined text <ul> Defines an unordered list <var> Defines a variable part of a text <xmp> Deprecated. Defines preformatted text
  22. 22. THANK YOU
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×