TNPW1 Ing. Jiří Štěpánek

 ordered list  (list item)  unordered list  (list item)

XHTML code: Item 1 Item 2 Item 3 In browser: Item 1 Item 2 Item 3

XHTML code: Item 1 Item 2 Item 3 In browse: 1. Item 1 2. Item 2 3. Item 3

 unordered list  It does not matter order of items  i.e. list of requests or properties  ordered list  Items are ordered and numbered by browser  i.e. workflow, result of a competition etc.  Ordered and unordered lists can be nested  Ul or Ol can contain only elements  When nesting -

 Only for representing two-dimensional data  Used to be misused to create whole layout.  Table:  Table caption:  Row: ▪ Cell: ▪ Headed cell:

My table caption Annual revenue Amount Company 1 6,3 mil +11,5%

Company 2 +15,2 mil 16,7% Company 3 4,5 mil -8,5%

Annual revenue Amount Company 1 6,3 mil +11,5% Company 2 15,2 mil +16,7% Company 3 4,5 mil -8,5%

Table head division - Contains set of header rows - Repeats table head in case of printing multi- page table. Head is printed on each page. - Can be used only once in table - Not required but reccomended

Table footer division - The same principle as thead Table body division - Creates table body division - There can be more than one division - can contain only table rows -

 Interactive part of page  Designed for sending data to web application  Provides range of controls  Its possible to have more forms on the page  Its not possible to nest forms  Content of forms controls can be checked by javascript  Submitted form is processed by web application

Form Attributes: action URL address of processing script method method of submitting- GET / POST (GET by default if method not specified) enctype coding of outgoing data (don’t have to be specified if not uploading files) application/x-www-form-urlencoded, multipart/form-data

get  Part of URL  Short forms  Insecure (submitted data shown as a part of URL)  Used exceptionaly post  Separate data transfer  Not part of URL  Can be secured (SSL)  Can transfer large amount of data  Commonly used

Range of forms controls Each form control has unique name within a form Id attribute (if used) is independent on name attribute Control can have some default value Working with form controls in many cases means to use javascript for validation

input (always single element) type type of control (text, password, checkbox, radio, submit, reset, button, image, hidden, file) name unique name of control within a form id identifier – used for style or javascript value default value of control disabled disabling form control – cannot be used

When submitting form, select element sends value of selected Option 1 Option 2 Option 3 Option 4 In XHTML 1.0 Strict must be attributes multiple and selected defined as following: multiple="multiple" selected="selected"

size Number of visible options without clicking multiple More options can be selected optgroup Option group inside select Label - label - Labeling control Name: my_name  Label is part of form control – when clicking label, the linked control is focused

Group of controls – -Visually grouping elements in order to have clear and well arranged form Naming of fieldset - Login

Horizontal rule - Creates horizontal rule (only for visual purposes) Hard space (non/breaking space) - Non-Breaking-Space - Looks like ordinary space - Two words, where is between them are never divided to separate lines (always stays side by side)

  Browser makes line break  Don’t misuse for making distance between elements or make margin etc.  Its not formatting element  Can be used inside paragraph when new line needed