1. LIST- HYPERLINK- IMAGES http://xuanhien.wordpress.com

2. Company Logo Contents IMAGE HYPERLINK LIST

3. HTML List  Unordered Lists  An unordered list is a list of items. The list items are marked with bullets (typically small black circles).  An unordered list starts with the tag. Each list item starts with the tag.  Syntax: Content1 … Company Logo

4. HTML List  Ex: An Unordered List: Coffee Tea Milk Company Logo

5. HTML List  Standard Attributes: The tag supports the following standard attributes:  Optional Attributes Company Logo

6. HTML List  A nested list: Ex: A list inside a list: Coffee Tea Black tea Green tea Milk Company Logo

7. HTML List  Ordered Lists: An ordered list is also a list of items. The list items are marked with numbers.  Syntax: Content1 Content2 … Company Logo

8. HTML List  Ex: An Ordered List: Coffee Tea Milk Company Logo

9. HTML List  Optional Attributes: Company Logo

10. HTML List  A nested list: A nested List: Coffee Tea Black tea Green tea Milk Company Logo

11. HTML List  Definition Lists  A definition list is not a list of single items. It is a list of items (terms), with a description of each item (term).  A definition list starts with a tag.  Each term starts with a tag.  Each description starts with a. Company Logo

12. HTML List  Syntax: definition term definition description … Company Logo

13. Learning HTML Pixel Short for picture element. A pixel refers to the small dots that make up an image on the screen. Pixel depth refers to the number of colours which may be displayed. Resolution The quality of the display on a monitor. The higher the resolution, the sharper the image. The number of pixels that can be displayed on a screen defines resolution. Scanner A hardware device that allows the user to make electronic copies of graphics or text. Company Logo

14. HYPERLINK  Hyperlink:  In web terms, a hyperlink is a reference (an address) to a resource on the web.  Hyperlinks can point to any resource on the web: an HTML page, an image, a sound file, a movie, …  An anchor is a term used to define a hyperlink destination inside a document.  Create hyperlink: Link text Company Logo

15. HYPERLINK  The href Attribute  The href attribute defines the link "address". Example: Visit 3Schools!  The target Attribute: defines where the linked document will be opened. Example http://www.w3schools.com/ Visit W3Schools! Company Logo

16. HYPERLINK  The name Attribute  When the name attribute is used, the element defines a named anchor inside a HTML document.  Named anchor are invisible to the reader.  Named anchor syntax: Any content  The link syntax to a named anchor: Any content  The # in the href attribute defines a link to a named anchor. Company Logo

17.  Example: Using htm links Internet Introduction to HTML Internet The Internet is a standardized, global system of interconnected computer networks linking millions of people worldwide. It is a network of networks that consists of millions of private and public, academic, business, and government networks of local to global scope that are linked by copper wires, fiber-optic cables, wireless connections, and other technologies. Introduction to HTML HTML, which stands for Hyper Text Markup Language, is the predominant markup language for web pages. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists etc as well as for links, quotes, and other items. Company Logo

18. HYPERLINK  Create a mailto link: This is a mail link: Send Mail mailto:someone@microsoft.com?subject=Hello%20a gain  Result on browser: This is a mail link: Send MailSend Mail Company Logo

19. HYPERLINK  Optional Attributes Company Logo

20. IMAGE  The Image Tag and the Src Attribute  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.  To display an image on a page, you need to use the src attribute. Src stands for "source". The value of the src attribute is the URL of the image you want to display on your page. Company Logo

21. IMAGE  The syntax of defining an image:  The URL points to the location where the image is stored. An image named "boat.gif" located in the directory "images" on "www.w3schools.com" has the URL: http://www.w3schools.com/images/boat.gif.  The browser puts the image where the image tag occurs in the document. If you put an image tag between two paragraphs, the browser shows the first paragraph, then the image, and then the second paragraph. Company Logo

22. IMAGE  Ex: An image from another folder: An image from W3Schools: Company Logo

23. IMAGE  The Alt Attribute  The "alt" attribute tells the reader what the browser can't load images. The browser will then display the alternate text instead of the image.  Ex: Company Logo

24. IMAGE  Optional Attributes Company Logo

25. IMAGE  Ex: A paragraph with an image. The align attribute of the image is set to "left". The image will float to the left of this text. A paragraph with an image. The align attribute of the image is set to "right". The image will float to the right of this text. Company Logo

26. IMAGE Company Logo

27. IMAGE  HTML align Attribute Company Logo

28. IMAGE  Ex: Company Logo

29. IMAGE  Use image to create hyperlink: An image that is a link: Company Logo

30. IMAGE  Create an image map: Split the image into some regions. Each region is a hyperlink.  Syntax:  Type: Rect Circle Poly Company Logo

31. IMAGE Ex: Click on one of the planets to watch it closer: Note: The "usemap" attribute in the img element refers to the "id" or "name" (browser dependant) attribute in the map element, therefore we have added both the "id" and "name" attributes to the map element. Company Logo

32. IMAGE  With the Background property of the tag, you can use a graphic file as a background image for your page.  Syntax: <BODY BACKGROUND=“Image file”  Example: Company Logo