Presentation is loading. Please wait.

Presentation is loading. Please wait.

C HAPTER – 3 I NTRODUCTION TO H TML By :- Pinkesh H. Patel.

Similar presentations


Presentation on theme: "C HAPTER – 3 I NTRODUCTION TO H TML By :- Pinkesh H. Patel."— Presentation transcript:

1 C HAPTER – 3 I NTRODUCTION TO H TML By :- Pinkesh H. Patel

2 W HAT IS INTERNET ? The Internet is a global system of interconnected computer networks that use the standard Internet Protocol Suite (TCP/IP) to serve billions of users worldwide. It is a network of networks that consists of millions of private, public, academic, business, and government networks, of local to global scope, that are linked by a broad array of electronic, wireless and optical networking technologies.

3 U NIT -3 I NTRODUCTION TO HTML W HAT IS HTML ? HTML, which stands for Hypertext Markup Language HTML is the basic building-blocks of WebPages. HTML documents are composed entirely of HTML elements that, in their most general form have three components: a pair of tags, a "start tag" and "end tag"; some attributes within the start tag; and finally, any textual and graphical content between the start and end tags, perhaps including other nested elements. The HTML element is everything between and including the start and end tags. Each tag is enclosed in angle brackets.

4 H TML T AGS : There are two type of html tags Paired tag Single tag ( Unpaired tags )

5 S INGLE TAGS This unpaired tag is actually the first line of your HTML document. This tag is important because it alerts the browser that is accessing your page that you are using a particular version of HTML. This tag is required in all HTML pages. Example :- [In XHTML : ] Use line breaks to control the way in which you want the text to appear on the screen.

6 S INGLE TAGS [In XHTML : ] Horizontal rule, to which attributes can be added, such as: aligned left, right, and center Adjusted for size, where n is the size in pixels Adjusted for width where w is the width in pixels or a percentage of the width of the page Made a solid bar

7 S INGLE TAGS [In XHTML : ] The meta tag must be included within the document's header and is used to supply additional information about your document. which is sent out to the remote server by your server, just before it sends out the document. This information is supplied by including one or more of the following attributes.

8 M AIN TAGS and The opening part of the html tag should be the second tag used in your document. It alerts a browser to the presence of an html document. The closing html tag should be the last line of your document. The head element is a container for all the head elements. Elements inside can include scripts, instruct the browser where to find style sheets, provide meta information, and more. The following tags can be added to the head section:,,,,, and. The text between and is the visible page content.It tells that this is the beginning of the page.

9 P AIRED TAGS and The title tag allows you to place text across the top of the browser window. The text between the opening and closing tags will be the title of your document. Do not use any special formatting or markup tags in the title of your document. and Paragraph break. This tag marks the beginning of a paragraph, not the end of one. It instructs the browser to place a blank line after the preceeding paragraph. The closing is typically omitted, and this does not violate the standard. All text between two tags are considered to be in the same paragraph. The block of text is called an element. A paragraph break has one attribute which can take three values : The default is to be aligned to the left side, so you don't have to use this one. will center the paragraph will place the paragraph on the right margin

10 P AIRED TAGS and This tag defines the headers in the document, where # is a number from 1 (the largest) to 6 (the smallest). Headers will place an automatic paragraph break after the last of the text, so you don't have to use a in conjunction with this tag. Heading1 Heading2 Heading3 Heading4 Heading5 Heading6

11 P AIRED TAGS and Bold text, which the user's browser cannot change. and This tag produces italicized text and This tag will make the text bigger than surrounding text and This tag will make the text smaller than surrounding text and Strike out text by placing a line through it. Note that not all browsers can display this, so be careful about using it and This tag produces subscript and This tag produces superscript

12 P AIRED TAGS and This tag produces underlined text. Since many browsers indicate links with underlined text, you should probably use this sparingly.

13 C HAPTER 7 F ORMATTING B ASICS Generally, text is unformatted in your Web document. You can use some text formatting options like, boldfacing, italic, underline etc. There are two major classes of text markup. Character Element Look Element

14 C HARACTER E LEMENT The character elements describe the type of the text formatting. :- It id used to specify emphasized text within an HTML document. :- This element indicates text, which should be more forceful than surrounding text. : - This element indicates text, which is an example of something.

15 :- This element indicates text that is the code for a program. :- This element denotes contact information for the author or an organization of the web site. :- This element indicates a reference to work, such as a book, report or web site., :- The element indicates that the text has been deleted from the current revision of the document. The element indicates that the text has been inserted into document.

16 :- This element indicates characters that should be typed in at a keyboard. Typically this is used in instruction manual. :- To indicate that a piece of text is a variable, i.e., a notation to be replaced by different actual expression. :- This element can be regarded as a special kind of emphasis. But some browser do not effectively support it. :- This element is used around names of people mentioned in a document. :- This element defines an abbreviation. It is just like normal text, but is used by automatic indexers. :- This element defines an acronym. :- This element defines text names the author of a document.

17 L OOK E LEMENT This element use for how the text is to be displayed and not it’s meaning. :- This element defines text that should be shown in boldface. It can be nested with other element but some browsers will respect only the innermost tag. :- This element defines text that should be shown in italics. It can be nested with other element but some browsers will respect only the innermost tag. : This element defines text that should be shown in underneath. It can be nested with other element but some browsers will respect only the innermost tag.

18 :- This element defines text that should be shown in a fixed width font. It can be nested with other element but some browsers will respect only the innermost tag.

19 C HAPTER 8 :- S PECIAL C HARACTER HTML codes use special characters including the left bracket ( ), ampersand (&), and quote(“) to represent certain attribute. Some characters are available on keyboard, but we need to use extended character, which are not found on the keyboard. Two formats can be used to do this. 1. Code number ( character reference ) 2. Phonetic reference ( entity reference )

20 C ODE N UMBER Character reference are composed of three parts. A leading ampersand character, (&). The decimal number corresponding to the character, preceded by a numbers symbol (#xxx). A terminating semicolon (;). For example the character reference for less than symbol (<) is <

21 P HONETIC R EFERENCE Entity reference are similar, but use symbolic names to represent character. Phonetic reference are composed of three parts. A leading ampersand character, (&). The name of the entity. A terminating semicolon (;). For example the character reference for less than symbol (<) is <

22 T ARGET L INKS :- A NCHOR TAG The HTML anchor element is used to create a link to a resource (another web page, a file, etc.) or to a specific place within a web page. An anchor is a piece of text or some other object (for example an image) which marks the beginning and/or the end of a hypertext link. The element is used to mark that piece of text (or inline image), and to give its hyper textual relationship to other documents. The text between the opening and closing tags,...text... can be the start or destination (or both) of a link. Here are some simple examples:

23 A BSOLUTE PATH :- Absolute paths are called that because they refer to the very specific location, including the domain name. The absolute path to a Web element is also often referred to as the URL. For example, the absolute path to this Web page is: http://webdesign.about.com/library/weekly/aa040 502a.htm

24 R ELATIVE PATH Relative paths change depending upon what page the links are located on. There are several rules to creating a link using the relative path: links in the same directory as the page have no path information listed filename sub-directories are listed without any preceding slashes weekly/filename links up one directory are listed as../filename

25 I MAGE AS HYPERLINK To make an image into a click-able hyperlink, simply replace the hyperlink text with some HTML image code. Images can have a relative path (/images/sample-image.gif), or they can have an absolute path (http://hyperlinkcode.com/images/sample- image.gif)

26 A UDIO AND VIDEO IN HTML


Download ppt "C HAPTER – 3 I NTRODUCTION TO H TML By :- Pinkesh H. Patel."

Similar presentations


Ads by Google