Chapter 01 HTML PDF

Chapter 01 HTML Prepared by Inst. Abdulsalam 1 Content What is markup language. Web Browsers HTML Documents What is an HTML Element? Nested HTML Elements HTML Elements HTML Heading HTML Paragraph HTML Quotation HTML L...

Chapter 01 HTML Prepared by Inst. Abdulsalam 1 Content What is markup language. Web Browsers HTML Documents What is an HTML Element? Nested HTML Elements HTML Elements HTML Heading HTML Paragraph HTML Quotation HTML Links HTML Phrase Elements HTML List HTML Div Structural Elements HTML Tables 2 ?What is HTML HTML stands for Hyper Text Markup Language HTML is the standard markup language for creating Web pages HTML describes the structure of a Web page HTML consists of a series of elements HTML elements tell the browser how to display the content HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc. 3 A Simple HTML Document DOCTYPE html>!< Page Title My First Heading My first paragraph. > &gt; & &amp; Space &nbsp; HTML Documents All HTML documents must start with a document type declaration:. The HTML document itself begins with and ends with. The visible part of the HTML document is between and. 8 What is an HTML Element? An HTML element is defined by a start tag, some content, and an end tag: Content goes here... The HTML element is everything from the start tag to the end tag: My First Heading My first paragraph. Note: Some HTML elements have no content (like the element). These elements are called empty elements. Empty elements do not have an end tag! 9 Nested HTML Elements count.1 HTML elements can be nested (this means that elements can contain other elements). All HTML documents consist of nested HTML elements. The following example contains four HTML elements (, , and ): My First Heading My first paragraph. 10 Nested HTML Elements count.2 The element is the root element and it defines the whole HTML document. It has a start tag and an end tag. Then, inside the element there is a. 11 HTML Attributes count.1 HTML attributes provide additional information about HTML elements. All HTML elements can have attributes Attributes provide additional information about elements Attributes are always specified in the start tag Attributes usually come in name/value pairs like: name="value" 12 HTML Attributes count.2 The tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to: Visit google The tag should also contain the width and height attributes, which specify the width and height of the image: 13 HTML Block and Inline Elements count.1 Every HTML element has a default display value, depending on what type of element it is. Block: A block-level element always starts on a new line, and the browsers automatically add some space (a margin) before and after the element. Inline: An inline element does not start on a new line, only takes up as much width as necessary. 14 HTML Block and Inline Elements count.3 Block-level Elements Two commonly used block elements are: and. The element defines a paragraph in an HTML document. The element defines a division or a section in an HTML document. Hello World Hello World 15 HTML Block and Inline Elements count.2 Inline Elements An inline element does not start on a new line. An inline element only takes up as much width as necessary. This is a element inside a paragraph. Hello World 16 HTML Headings HTML headings are titles or subtitles that you want to display on a webpage. HTML headings are defined with the to tags. defines the most important heading. defines the least important heading: This is heading 1 This is heading 2 This is heading 3 17 HTML Paragraphs HTML paragraphs are defined with the tag: This is a paragraph. This is another paragraph. 18 HTML for Quotations The HTML element defines a section that is quoted from another source. Browsers usually indent elements. 19 HTML Links count.1 The tag in HTML is typically used to create hyperlinks, allowing users to navigate from one page to another. HTML links are defined with the tag: This is a link 20 HTML Links count.2 Absolute link Link to other websites Yahoo Relative link Link to pages on your own site Relative to the current page This is a link When users click on the link, their email client opens up, ready to send an email to [email protected]. 22 HTML Links count.4 For Phone Number: Similarly, you can use the tel: protocol to create a clickable phone number link. This can be useful on mobile devices, where clicking the link will initiate a phone call.