Powered by Tech-Attacks

Introduction to HTML Tags, Attributes and Elements - HTML "Hello World" Program

Hello Readers, Today TechAttacks will show you the Introduction to HTML Tags, Attributes and Elements & HTML "Hello World" Program.
 
The basic structure of an HTML document includes tags, which surround content and apply meaning to it.


<html>
<body> 
  Hello World (Content / WebPage)
</body>
</html>


The declaration helps the browser to display a web page correctly or in other words we can say it lets the browser know which flavor of HTML we are using (HTML5 in our case).

Different DOCTYPE

HTML 5

HTML 4.01 Strict
This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or deprecated elements (like font). Framesets are not allowed.

HTML 4.01 Transitional
This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed.

HTML 4.01 Frameset
This DTD is equal to HTML 4.01 Transitional, but allows the use of frameset content.

XHTML 1.0 Strict
This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or deprecated elements (like font). Framesets are not allowed. The markup must also be written as well-formed XML.

XHTML 1.0 Transitional
This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed. The markup must also be written as well-formed XML.

XHTML 1.0 Frameset
This DTD is equal to XHTML 1.0 Transitional, but allows the use of frameset content.

XHTML 1.1
This DTD is equal to XHTML 1.0 Strict, but allows you to add modules (for example to provide ruby support for East-Asian languages).
Lets just get back to the point, is the opening tag that kicks things off and tells the browser that everything between that and the
closing tag is an HTML document.The stuff between and
is the main content of the document that will appear in the browser window.
Attributes
Tags can also have attributes, which are extra bits of information. Attributes appear inside the opening tag and their values sit inside quotation marks. They look something like
Margarine.
 Elements
Tags tend not to do much more than mark the beginning and end of an element. Elements are the bits that make up web pages. You would say, for example, that everything that is in between (and includes) the and
tags is the body element. As another example, whereas ""</code> and "<code>" are tags, "Rumple Stiltskin" is a title element.
Basic Tags
Creates an HTML document
Sets off the title and other information that isn’t displayed on the web page itself
Sets off the visible portion of the document
 
Body Attributes
Sets the background color, using name or hex value
Sets the text color, using name or hex value
Sets the color of links, using name or hex value
Sets the color of followed links, using name or hex value
Sets the color of links on click
Disallows text selection with the mouse and keyboard
 
Text Tags

Creates preformatted text

Creates the largest headline
Creates the smallest headline

Creates bold text
Creates italic text
Creates teletype, or typewriter-style text
Creates a citation, usually italic
Emphasizes a word (with italic or bold)
Emphasizes a word (with italic or bold)
Sets size of font, from 1 to 7
Sets font color, using name or hex value
 
Links
Creates a hyperlink
Creates a mailto link
Creates an image/link
Creates a target location within a document
Links to that target location from elsewhere in the document
 
Formatting

Creates a new paragraph

Aligns a paragraph to the left (default), right, or center.


Inserts a line break

Indents text from both sides

Creates a definition list

Precedes each definition term

Precedes each definition

    Creates a numbered list

      Creates a bulleted list

    • Precedes each list item, and adds a number or symbol depending upon the type of list selected

      A generic tag used to format large blocks of HTML, also used for stylesheets

      Adds an image
      Aligns an image: left, right, center; bottom, top, middle
      Sets size of border around an image

      Inserts a horizontal rule


      Sets size (height) of rule


      Sets width of rule, in percentage or absolute value


      Creates a rule without a shadow

       
      Tables
      Creates a table

      Sets off each row in a table
      Sets off each cell in a row
      Sets off the table header (a normal cell with bold, centered text)
       
      Table Attributes
      Sets width of border around table cells

      Sets amount of space between table cells

      Sets amount of space between a cell’s border and its contents

      Sets width of table, in pixels or as a percentage of document width

      or Sets alignment for cell(s) (left, center, or right)
      or Sets vertical alignment for cell(s) (top, middle, or bottom)
      Sets number of columns a cell should span (default=1)
      Sets number of rows a cell should span (default=1)
      Prevents the lines within a cell from being broken to fit
       
      Frames
      Replaces the tag in a frames document; can also be nested in other framesets
      Defines the rows within a frameset, using number in pixels, or percentage of width
      Defines the columns within a frameset, using number in pixels, or percentage of width
      Defines a single frame - or region - within a frameset
      Defines what will appear on browsers that don’t support frames
       
      Frames Attributes
      Specifies which HTML document should be displayed
      Names the frame, or region, so it may be targeted by other frames
      Defines the left and right margins for the frame; must be equal to or greater than 1
      Defines the top and bottom margins for the frame; must be equal to or greater than 1
      Sets whether the frame has a scrollbar; value may equal “yes,” “no,” or “auto.” The default, as in ordinary documents, is auto.
      Prevents the user from resizing a frame
       
      Forms
      For functional forms, you’ll have to run a script. The HTML just creates the appearance of a form.
      Creates all forms

      Creates a scrolling menu. Size sets the number of menu items visible before you need to scroll.
      Sets off each menu item
      Creates a pulldown menu

      Creates a text box area. Columns set the width; rows set the height.
      Creates a checkbox. Text follows tag.
      Creates a radio button. Text follows tag
      Creates a one-line text area. Size sets length, in characters.
      Creates a Submit button
      Creates an actual button that is clicked
      Creates a Submit button using an image
      Creates a Reset button.

      No comments:

      Post a Comment