html pptshow

HTML stands for Hyper Text Markup LanguageHyper is the opposite of linear. HTML allows the person viewing the World Wide Web page to go anywhere,any time they want. Text is what you will use. Real, honest to goodness English letters. Mark up is what you will do.It Refers to sequence of characters or symbols that are inserted in text or word processing fileLanguage because they needed something that started with "L" to finish HTML and Hypertext Markup Louie didn't flow correctly. Because it's a language, really -- but the language is plain English.

A.Nagesh,Informatics Dept.

HTML Document Structure HTML consists of standard ASCI (American Standard Character Interchange) text surrounded by html tags.Tags are instructions which tell a web browser how to display a document. HTML tags are enclosed within < and > symbols so that the editor knows that anything within those symbols needs to be interpreted as an instruction rather than being displayed as text. HTML files are saved with an .html or .htm extension HTML files are created by using a simple text editor (Notepad,Wordpad etc.,)HTML tags normally come in pairs like and The first tag in a pair is the start tag, the second tag is the end tag The text between the start and end tags is the element content HTML tags are not case sensitive, means the same as


Many HTML tags contain one or more attributes that can give extra information to tell the browser how to interpret the tag.( In most tags, the attributes are optionalAttributes always come in name/value pairs like this: name="value". Attributes are always added to the start tag of an HTML element.Attribute values should always be enclosed in quotes. Double style quotes are the most common, but single style quotes are also allowed An html document is divided into two main sections the head section and the body section. The head section contains information about the document and is usually placed at the top of the html document (so it can load into the browser first) and wont be displayed inside your browser window. The body section contains the content of your document that will be displayed, such as text and images.


Basic HTML Tags ... TagThis element identifies the document as containing HTML elements.The HTML element is not visible upon HTML user agent rendering and can contain only the and elements. ... TagThe head of an HTML document is an unordered collection of information about the document. ... Tag is included in the head section- Specifies the title of the document that will display in your browsers title bar ... TagThe body of a HTML document contains all the text and images that make up the page, together with all the HTML elements that provide the control/formatting of the page


Attributes of

BGCOLOR The BGCOLOR attribute, allows setting of the background colour for the document.Example :- Document hereBACKGROUNDThe BACKGROUND attribute can be used to point to an image file that will be tiled across the browser window, to provide a background for the document. Specifying :Example :-Document here


TEXTThis attribute is used to control the colour of all the normal text in the document.Example :- Document hereLINK, VLINK, and ALINK attributesThese attributes allow control over the link text colouring. VLINK stands for visited link, and ALINK stands for active link. The default colouring of these is: LINK=blue (#0000FF), VLINK=purple (#400040), and ALINK=red (#FF0000).Example :- Document here


HTML Document StructureSet up an html document1 Open your HTML editor You should have a blank document to begin with 2 Enter the following HTML. Cannington Cougars Football Club Website 3 Save the file as index.html. Make sure the file called back.gif has also been saved in that same location. 4 Preview your document in your web browser. To do this, you can open your web browser, go to your file menu and then open the index file you just saved. Many HTML editors also have a built in preview option.


Headings

HTML defines six levels of heading. A Heading element implies all the font changes, paragraph breaks before and after, and white space necessary to render the heading.Headings are defined with the to tags. defines the largest heading. defines the smallest heading.The exact sizes they appear as will vary from one browser to another Level 1 heading Level 2 heading Level 3 heading Level 4 heading Level 5 heading Level 6 heading

ALIGN attribute The ALIGN = left | center | right attribute has been added to the through to elements. Example :- Hello, this is a headingHTML automatically adds an extra blank line before and after a heading.


Horizontal rules A horizontal rule may be used to place a dividing line in your document and is a good way to separate different sections. It will usually appear as 3D style engraved line.Some of the attributes that can be included in a tag are: WIDTH Can be specified in pixels or percentage of page width or ALIGN Specifies if the line will be aligned to the left, center (use US spelling) or right SIZE Specifies the height (thickness) of the line in pixels NOSHADE Normally a horizontal rule will appear as an engraved line. Specifying this option will make it appear as a solid colour.

Comments in HTML The comment tag is used to insert a comment in the HTML source code. A comment will be ignored by the browser. You can use comments to explain your code, which can help you when you edit the source code at a later date.Example :-Line BreaksThe Line Break element specifies that a new line must be started at the given point.The tag is used when you want to end a line, but don't want to start a new paragraph. The tag forces a line break wherever you place it.Example :- This is a paragraph with line breaksThe tag is an empty tag. It has no closing tag.


ParagraphsThe Paragraph element indicates a paragraph. Typically, paragraphs are surrounded by a vertical space of one line or half a line. With some browsers, the first line in a paragraph is indented.Paragraphs are defined with the tag. This is a paragraphThis is another paragraphALIGN attributeBasically, ALIGN = left | center | right attributes have been added to the element.Example :- ... All text within the paragraph will be aligned to the left side of the page layout. This setting is equal to the default element. ... All text within the paragraph will be aligned to the centre of the page. ... All text within the paragraph will be aligned to the right side of the page.HTML automatically adds an extra blank line before and after a paragraph.A division tag can also be used to create a new paragraph. The difference is that it doesnt create a blank space before the paragraph the way a tag will .


Text Formatting Tags ... TagThe Bold element specifies that the text should be rendered in boldface, where available. Otherwise, alternative mapping is allowed.Example :-The instructions must be read before continuing.

... TagThe element specifies that the enclosed text should be displayed, if practical, using a big font (compared with the current font).Example :-This is normal text, with this bit being big text.

... TagThe Emphasis element indicates typographic emphasis, typically rendered as italics.Example :-The Emphasis element typically renders as Italics.


Text Formatting Tags ... TagThe Italic element specifies that the text should be rendered in italic font, where available. Otherwise, alternative mapping is allowed.Example :Anything between the I elements should be italics. ... TagThe element specifies that the enclosed text should be displayed, if practical, using a small font (compared with the current font). Example :-This is normal text, with this bit being small text ... TagThe Strong element indicates strong typographic emphasis, typically rendered in bold.Example :-The instructions must be read before continuing.


Text Formatting Tags ... TagThe element specifies that the enclosed text should be displayed as a subscript, and if practical, using a smaller font (compared with normal text).Example :-This is the main text, with this bit being subscript. ... TagThe element specifies that the enclosed text should be displayed as a superscript, and if practical, using a smaller font (compared with normal text). Example :-This is the main text, with this bit being superscript. ... TagThe ... element states that the enclosed text should be displayed with a horizontal line striking through the text. Alternative mappings are allowed if this is not practical.Example :-This text would be struck through


Text Formatting Tags ... TagThe ... Elements state that the enclosed text should be rendered, if practical, underlined. This is an HTML 3.0 element and may not be widely supported.Example :-The main point of the exercise ... Tag The Preformatted Text element presents blocks of text in fixed-width font, and so is suitable for text that has been formatted on screen. WIDTH attribute The element may be used with the optional WIDTH attribute, which is a Level 1 feature. The WIDTH attribute specifies the maximum number of characters for a line and allows the HTML user agent to select a suitable font and indentation. If the WIDTH attribute is not present, a width of 80 characters is assumed. Where the WIDTH attribute is supported, widths of 40, 80 and 132 characters should be presented optimally, with other widths being rounded up.Example: This is an example line.


The FONT tag One of the most commonly used formatting tags in standard html is the tag. With its various properties it allows you to specify several types of formatting at once. These are some of the properties that can be set in the font tag: SIZE specifies the size where 1=smallest and 7=largest. Size 2 or 3 will usually be close to normal text size. The exact size may vary from one browser to another. COLOR specifies the colour of the text (NOTE: you need to use US spelling). FACE specifies the font (such as Arial) that will be used. You can specify an alternate font in case the person viewing your site doesnt have the one you specified. Simply type the name of each font separated by commas. If the first font isnt available the next will be used. If none are available, the default system font will be used. Example: Sample text


The Image Tag The Image element is used to incorporate in-line graphics into an HTML document. This element cannot be used for embedding other HTML text.In HTML, images are defined with the tag. The tag is empty, which means that it contains attributes only and it has no closing tag. Image AttributesSRCSpecifies the URL of the image to be displayed on page. HEIGHTThese two attributes specify the size of the image WIDTHin pixels. If they are not included, the image will display at its normal size. It is usually a good idea to include these attributes for two reasons.1 The browser can load the picture quicker when it already knows its exact size.2 The browser will make room for the loading picture rather than shifting everything down the page as each image loads.HSPACEThese attributes specify the amount of horizontal VSPACEand vertical space around the picture in pixel measurements.


ALT Specifies the text that will display while the picture is loading or if it doesnt load. If the pictures important, make sure you include this. Some people dont have browsers that show images and some turn image loading off to speed up their browsing. Recent browsers use the alternate text as a pop-up when the mouse is moved over the image.BORDER Specifies the width (in pixels) of the pictures border. Set this to 0 if the picture is a hyper-link; otherwise a border the colour of your links will appear around the image.ALIGN TOP Aligns the top of the picture with the top of the current line of text MIDDLEAligns the middle of the picture with the middle of the current line of textBOTTOM Aligns the bottom of the picture with the bottom of the current line of textLEFT Aligns the picture to the left of text and will make text wrap around the pictureRIGHT Aligns the picture to the right of text and will make text wrap around the picture


html pptshow

Documents