70 likes | 105 Views
Technologies for web publishing. Ing. Vaclav Freylich. Lecture 2. Lists. Important HTML elements Simple syntax but powerful function For easy and well-arranged text output Frequently used for making the navigation structures. Unordered lists. Unordered list body <ul></ul>
E N D
Technologies for web publishing Ing. Vaclav Freylich Lecture 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
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
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
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
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
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