Prezentace se nahrává, počkejte prosím

Prezentace se nahrává, počkejte prosím

Internet publishing HTML (XHTML) language Petr Zámostný room: A-72a phone.: 4222

Podobné prezentace

Prezentace na téma: "Internet publishing HTML (XHTML) language Petr Zámostný room: A-72a phone.: 4222"— Transkript prezentace:

1 Internet publishing HTML (XHTML) language Petr Zámostný room: A-72a phone.:

2 Essential HTML components  Element Element example  Start tag  Element content  End tag „content-less elements“  HTML 4.01: no closing needed  XHTML: elements must be closed Element can contain another elements Well-formed documents

3 Essential HTML components  Attribute Example  Link somewhere else More detailed element specification Must be placed in starting element brackets Value must be enclosed in "" Element may have more attributes Attributes order is arbitrary

4 Essential HTML components  Character entities Characters difficult to enter via keyboard HTML reserved characters , & Example  &entity_name; >> << && “" Nonbreaking space  &#character_unicode_number; ←← Й Й

5 Essential HTML components  Entities defined by XHTML  Entity given by number in UNICODE table - Character listings  In order to display properly, the characters must be supported by the browser as well as they must be included in specified font

6 XHTML page structure XML declaration Document type definition – standard Core dokument

7 XML declaration  Specifies the XML version and encoding for applications working at the XML level  It is not mandatory, but it is automatically included by some editors  It can cause problems in some MSIE installations  Recommendation: don not use it/delete it

8 Document type definition  Transitional  Strict  Frameset

9 Document type definition  Specifies the standard used for writing the document  Lists elements that are allowed in the document and their nesting

10 Core document – element  Must contain the namespace declaration xmlns=  If it is missing it should work safely only in no other namespaces are used......

11 Head element content  Name of the page displayed in the browser window caption  Document metadata  Usually they are not interpreted by browsers, used e.g. for fulltext search robots  Exception: document type and encoding info Example

12 body element content  Text and formatting instructions  Default behavior Consecutive spaces, tabs, line-breaks are rendered as single space  Block and inline elements text elements

13 Examples of elements (rehearsing)  Block …  Inline

14 Standard attributes  Can be used for all elements except base, head, html, meta, param, script, style a title  More simply: they can be used in all visual elements

15 Standard attributes  class – specifies class (group) the element belongs to  id – assigns unique identifier to the element  style – can be used to directly set element style in CSS  All attributes above are used for application of styles and dynamic behavior  title – specifies element tooltip

16 Language attributes  For all elements except base, br, frame, frameset, hr, iframe, param a script  dir – can have values ltr | rtl and controls the text direction (left-to-right, right-to- left)  lang – document language

17 Text structure elements  div – section  p – paragraph  span – inline block  br – line-break (content-less )

18 Text structure (example) 1 st paragraph 2 nd paragraph 3 rd paragraph 4 th paragraph of text broken into 2 lines

19 Headings Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6

20 Formátting emphasized text strong printed text bold text italics text subscript text superscript monospace font Preformatted text ABC

21 Lists Unordered list kolečko kroužek čtvereček Ordered list item 1 item 2 item 3 Definition list HTML HyperText Markup Language XML eXtensible Markup Language

22 Graphics  img – inserts image  Attributes src – URL of image file alt – alternative text  For users that cannot/does not want to display images height, width  Enables the browser get image dimensions before they are actually downloaded – speeds up document display  Can be used to resize images ….. But there are better ways to do it

23 Graphics (příklad) Valid XHTML 1.0!

24 Tables  Tables are created hierarchically by following elements  table – table tr – row  td – cell  th – heading cell

25 Tables  Important attributes of table element border cellspacing cellpadding frame, rules

26 Tables záhlaví sloupce 1 záhlaví sloupce 2 buňka 1 buňka 2 buňka 3 buňka 4 

27 Table borders Bez okraje 1. buňka 2. buňka 3. buňka 4. buňka S okrajem 1. buňka 2. buňka 3. buňka 4. buňka Vnější okraj tabulky 1. buňka 2. buňka 3. buňka 4. buňka Vnitřní okraj tabulky 1. buňka 2. buňka 3. buňka 4. buňka

28 Structuring Sklizeň ovoce Hrušky Jablka Celkem Petr 10 Pavel 15 7 

29 Table dimensions Implicitní chování 1. buňka 2. trochu větší buňka Pevná šířka 1. buňka 2. trochu větší buňka Šířka v % okna 1. buňka 2. trochu větší buňka 

30 Table alignment Vodorovné zarovnání buňka zarovnaná vlevo buňka zarovnaná vpravo buňka zarovnaná na střed buňka zarovnaná do bloku Svislé zarovnání buňka zarovnaná nahoru buňka zarovnaná na střed buňka zarovnaná dolů buňka zarovnaná na základní čáru 

31 Merging cells buňka buňka buňka buňka buňka expandovaná buňka buňka buňka buňka buňka buňka buňka buňka 

Stáhnout ppt "Internet publishing HTML (XHTML) language Petr Zámostný room: A-72a phone.: 4222"

Podobné prezentace

Reklamy Google