josefields
Uploaded by
7 SLIDES
115 VUES
70LIKES

Mastering Lists in HTML for Organized Content

DESCRIPTION

Learn about unordered, ordered, and definition lists in HTML for structuring content efficiently. Includes examples and syntax.

1 / 7

Télécharger la présentation

Mastering Lists in HTML for Organized Content

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Technologies for web publishing Ing. Vaclav Freylich Lecture 2

  2. Lists Important HTML elements Simple syntax but powerful function For easy and well-arranged text output Frequently used for making the navigation structures TNPW1 - Lecture 2

  3. Unordered lists Unordered list body<ul></ul> List item<li></li> - Visual form is similar in all browser but not standardized Sample code (unordered list with three items): <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul> Output: • Item 1 • Item 2 • Item 3 TNPW1 - Lecture 2

  4. Ordered lists Ordered list body<ol></ol> List item<li></li> - Used when the order of list items is important Sample code (ordered list with three items): <ol> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ol> Output: • Item 1 • Item 2 • Item 3 TNPW1 - Lecture 2

  5. Definition lists Definition list body<dl></dl> Definition term<dt></dt> Definition description<dd></dd> Unordered list of terms Each term can have a description Definition term and definition description can contain any element (not only the text) TNPW1 - Lecture 2

  6. Definition lists Example <dl> <dt>Term 1</dt> <dd>Description 1</dd> <dt>Term 2</dt> <dd>Description 2</dd> </dl> Output Term 1 Description 1 Term 2 Description 2 TNPW1 - Lecture 2

  7. Images Non-pair element <img /> <img src="button.gif" alt=“Image description" width="117" height="18“ /> The src attribute contains the absolute or relative server path to the image file Parameters height and width and alternate description alt are always required ! We can’t adjust the real image size (file size) by changing the width and height attributes TNPW1 - Lecture 2

More Related