Presentation is loading. Please wait.

Presentation is loading. Please wait.

HyperText Markup Language

Similar presentations


Presentation on theme: "HyperText Markup Language"— Presentation transcript:

1 HyperText Markup Language
Introduction to HTML HTML Tags

2 1.Introduction to HTML A Web page is stored on a Web server, which makes the page available to users of the Web. To view a Web page, the user runs a Web browser, a software program that retrieves the page and displays it.

3 1.Introduction to HTML Web pages are generally written in HTML
Hypertext Mark-up Language HTML is a method of marking-up text Designed to describe structure of a document Not designed to describe the way the document is displayed - this is up to the individual browser

4 1.Introduction to HTML What is “marking up”? Why is marking up useful?
a description of the structure of a document Why is marking up useful? can make it easier to understand can make it more interesting to read Especially when you have a large quantity of text - it helps to highlight key sections (Imagine trying to read a novel if it had no paragraph breaks...)

5 Notepad MS-Word Front Page Dream weaver
1.Introduction to HTML Tools for creating HTML documents Notepad MS-Word Front Page Dream weaver

6 2.HTML tags An HTML document is a simple text file.
It contains text surrounded by elements used to mark up sections. These elements are called tags Tags are indicated by angled brackets <...> Tags generally come in pairs One tag to begin the mark up (opening tag), and one to end the mark up (closing tag begins with a forward slash </...>)

7 <B> Introduction to HTML </B>
2.HTML tags General form of a HTML tag: <B> Introduction to HTML </B> Opening Tag Closing tag TEXT TO BE FORMATTED

8 <html><head></html></head>
2.HTML tags Tags must be properly nested This means when you open a tag, all tags inside it must be closed before you can close the tag, e.g. <html><head></head></html> ...is properly nested but: <html><head></html></head> ...is not properly nested The html element has been closed off, but the head element is still open - not allowed!

9 <html> ... </html>
2. HTML tags Required Tags: HTML Contains entire HTML document <html> ... </html> Everything in between the <html> and the </html> is HTML code The first tag that you will need to know is the tag which indicates the contents are in HTML

10 2.HTML tags An HTML document consists of two parts A head A body

11 Software Applications
2.HTML tags HEAD Contains title <title> Software Applications </title> The head of an HTML document is an unordered collection of information about the document It does not contain information to display in the document when rendered by a browser

12 2.HTML tags BODY Contains all objects you wish to place on your web page

13 2.HTML tags Web Page Structure <html> Starts HTML document
<head> document heading <title> This is the title </title> </head> Closes the heading <body> Starts the body body content goes here </body> Closes the body </html> Closes the HTML document HTML HEAD BODY TEXT CONTENT TEXT CONTENT <TAGS> LINK TAGS End of HTML

14 2.HTML tags Most tags have attributes Tag <body>
has the following attributes (amongst others) bgcolor - sets the background colour

15 2.HTML tags The heading tags <h1></h1>
Headings The heading tags <h1></h1> <h2></h2> ... <h6></h6> indicate a block as being a heading

16 2.HTML tags Line Break The tag <br>
forces a carriage return in a document You would place a <br> tag each time you want to add a line break without starting a new paragraph This is an example of a tag that does not have a closing tag

17 2. HTML tags The paragraph tag <p></p>
Paragraphs The paragraph tag <p></p> marks up a block as being a single paragraph

18 2.HTML tags <html> Starts the HTML document
<head> Starts the document heading <title>This is the page title</title> </head> <body> starts the document body <h1> This is a heading1 tag</h1> <br> is a line break tag <p> is a paragraph tag followed by the end of paragraph </p> <b> This text is bold </b> </body> </html>


Download ppt "HyperText Markup Language"

Similar presentations


Ads by Google