Prabu html


Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Prabu html

  1. 1. INTRODUCTION TO HTML HyperText Markup Language (HTML) is the predominant markup language for the creation of web pages. It provides a means to describe the structure of text-based information in a document — by denoting certain text as headings, paragraphs, lists, and so on — and to supplement that text with interactive forms, embedded images, and other objects. HTML can also describe, to some degree, the appearance and semantics of a document, and can include embedded scripting language code which can affect the behavior of web HTML browsers and other HTML processors.HTML is a subset of Standard Generalized Markup Language (SGML) and is specified by the World Wide Web Consortium W3C .
  2. 2. As the HTML is a very easy language for creating the web pages. It can be learned in few hours or in few days. It is the basic format of the HTML file it can be displayed on mostly operating system which supports the web browser. NEED FOR HTML
  3. 3. HTML Tags Basic HTML Tags The most important tags in HTML are tags that define headings, paragraphs, body and line breaks. The basic HTML Tags are described here in the form of table so that you can remind them easily. Basic HTML Tags Tag Description <html> Defines an HTML document <head> Defines information about the document <title> Defines the document title <body> Defines the document's body <h1> to <h6> Defines header 1 to header 6 <p> Defines a paragraph <br> Inserts a single line break <hr> Defines a horizontal rule <!--> Defines a comment
  4. 4. Description Of The Above Tags <html>tag This element tells a browser that this is an HTML document. This tag is defined at the top of the HTML file and at the end of file. Format: <html> <body>..............body of HTML.............</body></html> Example: <html> <body> this is my first page </body></html>
  5. 5. <head> tag The head tag defines information about the document. The browser does not display the &quot;head information&quot; to the user. The following tags can be in the head section: <base>, <link>, <meta>, <script>, <style>, and <title>. The head tag is used between <html> and <body> tags. Format: <html> <head>.....head sections....</head><body>......body of HTML........</body></html> Example: <html> <head><title>Basic tag</title></head>>body> this is my first page </body></html>
  6. 6. <title> tag Title tag defines the title of the document which appears in the Title bar of the explorer window. Title tag is used in between <head> and </head> tag because it is title tag is section of <head> tag. Format: <html> <head><title>Title of the Page</title></head><body>.....body of HTML......</body></html> Example: <html> <head><title>Basic tag</title></head><body> this is my first page </body></html>
  7. 7.     <body> tag The body element defines the document's body. It contains all the contents of the document (like text, images, colors, graphics etc). Format: <body bgcolor =&quot;color_name&quot; background=&quot;file_name&quot; links=&quot;color_name&quot; text=&quot;color_name&quot;> Example: <body bgcolor =&quot;red&quot; background=&quot;c:imgsky.jpg&quot; links=&quot;blue&quot; text=&quot;black&quot;>
  8. 8. Character Format Tags These tags are used for the formatting of the text such as underline, bold, italic, font, size, color of the text. All these character formatting Tags are defined in the table shown below: Char Format Tag Description <b> Displays bold text <i> Displays italic text <tt> Renders as teletype or mono spaced text <u> Displays underlined text <em> Displays emphasized text <big> Displays big text <small> Displays small text <strong> Displays strong text <sub> Displays subscripted text <sup> Displays superscripted text <bdo> Defines the direction of text display <font> Defines the font face, size, and color of text
  9. 9. SYNTAX FOR CHARACTER FORMAT TAGS <b> Tag The <b> tag is used to make the text bold. Format: <b> ................text.........</b> <i> Tag The <i> tag displays the italic text. Format: <i> ................text.........</i>; <tt> Tag The <tt> tag displays the typewriter text. Format: <tt> ................text.........</tt>
  10. 10. Examples of the Text Formatting tags Examples Outputs <b> This text is bold </b> This text is bold <strong> This text is strong </strong> This text is strong <big> This text is big </big> This text is big <em> This text is emphasized </em> This text is emphasized <i> This text is italic </i> This text is italic
  11. 11. Output Tags These tags are often used to display computer/programming code. You might be surprised for &quot;how to display the text containing the spaces, line breaks, programming codes, sample text, define variable&quot;. Do not worry, because in this chapter we are going to show you how easily you can do easily. So lets start with these tags: Tag Description <pre> Defines preformatted text <code> Defines computer code text <tt> Defines teletype text <kbd> Defines keyboard text <var> Defines a variable <dfn> Defines a definition term <bdo> Defines the direction of text display <samp> Defines sample computer code
  12. 12. Block Tags Tag Description <acronym> Defines an acronym <abbr> Defines an abbreviation <address> Defines an address element <blockquote> Defines an long quotation <center> Defines centered text <q> Defines a short quotation <cite> Defines a citation <ins> Defines inserted text <del> Defines deleted text <s> Defines strikethrough text <strike> Defines strikethrough text
  13. 13. Other Tags The <style> tag The <style> tag defines a style in a document. The <div> tag The <div>tag defines a division/section in a document. Use the <div> tag to group block-elements to format them with styles. This tag is used below the <body> tag. Marquee Text with <marquee> Tags This tag is used to to get a moving text. As on the television you see the moving news headlines. You can do this by using the <marquee> tag. Format: <marquee> Write the text to be scrolled </marquee> Example: <marquee> Write the text to be scrolled </marquee>