Scribd Logo
Upload

Welcome to Scribd!

  • XHTML Tutorial

    Uploaded by

    Nikola Dereban
    20 views35 pages

    Original Title

    Xhtml Tutorial

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    20 views35 pages

    XHTML Tutorial

    Uploaded by

    Nikola Dereban

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 35

    XHTML Tutorial


    ,
    2009


    1 XHTML
    1.1

    XHTML
    j . . . . . . . . . . . . . . . .

    A ()
    . . . . . . . . . . . . . . .

    1.3

    , . . . . . . . . . . . . .

    1.4

    CSS . . . . . . . . . . . . . . . . . . . . . 11

    1.5

    XHTML . . . . . . . . . . . 11

    1.6

    XHTML . . . . . . . . . 14

    1.2

    1.6.1

    . . . . . . . . . . . . 15

    1.6.2

    . . . . . . . . . . . . . . . . 15

    1.6.3

    (root) . . . . . . . . . . . . . 16

    1.6.4

    . . . . . . . . . . . . . 17

    1.6.5

    1.6.6

    id name . . . 19

    . . . . . . . . . 18

    1.7

    lang . . . . . . . . . . . . . . . . . . . . . . 19

    1.8

    DOCTYPE . . . . . . . . . . . . . . . . . . . . . . . . 20

    1.9

    1.8.1

    XHTML 1.0 Strict . . . . . . . . . . . . . . . . 20

    1.8.2

    XHTML 1.0 Transitional

    1.8.3

    XHTML 1.0 Frameset . . . . . . . . . . . . . . 21

    . . . . . . . . . . . . 21

    j . . . . . . . . . . . . . . . . . . . . . . . . 21
    3

    23

    29

    33


    ,
    .
    j , j , j, j ., j j
    (web site, j),
    .
    j ,
    , ` ,

    j,
    j .
    , j
    HTML (Hyper Text Mark-up Language). j
    j , , ,

    .
    HTML .
    j

    j, HTML.
    , j XHTML (eXtensible
    Hyper Text Mark-up Language). j j
    j HTML.
    j , ,
    , XHTML .

    5

    CSS (Cascading Style Sheets


    ).
    j j
    XHTML j, ,
    .
    , HTML.
    j, ,
    j j e .

    XHTML
    1.1

    XHTML
    j

    HTML (Hyper Text Mark-up Language),


    j j . j
    j (language) j,
    , (tags).
    j,

    j () , ,
    . . (mark-up)
    (hyper text).
    HTML Tim Berners Lee ,
    Dan Connolly Karen Muldrow.
    , j HTML ,
    ,

    . (browsers)
    . , Netscape
    Microsoft, .
    7

    j HTML j World Wide Web Consortium ( W3C), j



    .
    j
    http://www.w3c.org.
    , 26.01.2000,
    HTML 4.01, XHTML 1.0.
    j , XHTML
    , j XML
    (eXtensible Mark-up Language)1 . j XHTML
    j HTML.
    XHTML, j j,
    .
    Mozilla Firefox. j ( , GNU/Linux, MS
    Windows ).

    1.2

    A ()

    XHTML j j, j XHTML
    .html, .htm. , ,
    XHTML j ,
    gedit, kwrite, vim ., j
    GNU/Linux, Notepad
    MS Windows.
    j j
    , HTML, XHTML, CSS . 1
    XML XHTML,
    j . XHTML , XML .

    , , j .
    j XHTML , , .
    . , j Mozilla Firefox, Opera, MS Internet Explorer .
    , ,
    .
    ,
    Ubuntu Linux. gedit, Mozilla Firefox.
    ,
    XHTML .

    1.3

    XHTML j .

    , (),
    . .

    < ( ...). .
    j j,
    . j
    > ( ...).
    <html>
    ...
    </html>
    j j ,
    , ( ).
    , ,
    , / (slash).

    .
    9

    j j ()
    . j j
    ,
    .
    XHTML ,
    . j
    , slash, j
    , j .
    . :
    <br />
    (attributes). . ,
    .
    (values) =. .
    <a href="http://iu.blogsite.org"> </a>
    , <a> j , href
    j , http://iu.blogsite.org
    .
    . j .
    j
    ,
    .
    , j (default) .
    T,
    .
    ,
    . j
    :
    ():
    10

    <b><i></i></b>
    <i><b></b></i>
    ():
    <b><i></b></i>
    <i><b></i></b>
    , .
    (bold ),
    (italic), .
    XHTML j,
    ,
    j View/Source View/Page Source. j
    , .

    1.4

    CSS

    World Wide Web Consortium,


    , HTML,
    XHTML. j
    deprecated.
    ,
    .
    , o CSS. , CSS
    , .

    1.5

    XHTML

    XML, j XHTML
    . . root, . XHTML
    :
    11

    <html>
    ...
    </html>
    j (root) XHTML . j
    XHTML .
    XHTML j (head ),
    (body).
    <html>
    <head>
    ...
    </head>
    <body>
    ...
    </body>
    </html>
    (),
    (j). j
    , ,
    . j . jj : title meta,
    title XHTML .
    <head>
    <title>j </title>
    <meta http-equiv="Content-Type"
    content="text/html; charset=utf8" />
    </head>
    : j , : title,
    , j .
    meta, , . , j
    12

    utf8 j Unicode .

    . ,
    ( ), j j
    View/Encoding.
    XHTML ,

    j j .
    XHTML . . DOCTYPE j2 .
    <!DOCTYPE ...>
    <html>
    <head>
    <title>...</title>
    </head>
    <body>
    ...
    </body>
    </html>
    DOCTYPE j XHTML ,
    XHTML .
    j ,
    XHTML , j , j :
    <!DOCTYPE html PUBLIC "-//W3C//DTD
    XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/
    xhtml1-transitional.dtd">
    <html>
    <head>
    2

    Document Type Definition

    13

    <title>j </title>
    <meta http-equiv="Content-Type"
    content="text/html; charset=utf8" />
    </head>
    <body>
    ! j .
    </body>
    </html>
    ,
    , : .html ( .htm).
    , .
    , (, )
    j, index.html default.html,
    j j. j
    j
    .

    1.6

    XHTML

    XML j j .

    j ,
    (well formed ).
    , j j, ,

    .
    ,
    j, . XML HTML, j XHTML, j
    .
    ,
    XHTML :
    14

    ( ) ;
    ;
    (root) ;
    ;
    ;
    .

    1.6.1

    j XHTML
    ( )
    .
    , :
    <body>
    <p>
    .</p>
    </body>
    :
    <BODY>
    <P>
    .</P>
    </BODY>

    1.6.2

    XHTML ,

    , :
    15

    <p> .</p>
    <p> ,
    .</p>
    :
    <p> .
    <p> .
    j j .
    (emty). XHTML
    .
    (slash) j .
    :
    ( break ): <br />;
    x j: <hr />;
    : <img src="penguin.gif" />.

    ,
    .

    1.6.3

    (root)

    XHTML
    (root) . <html>.
    .
    , (subelements), (children). , ,
    , .
    16

    j XHTML j <html>, j
    <head> <body>:
    <html>
    <head>
    ...
    </head>
    <body>
    ...
    </body>
    </html>

    1.6.4

    XHTML ,

    . ,
    HTML :
    <b><i> </b></i>
    XHTML ,
    :
    <b><i> </i></b>
    ( j),
    .
    ,
    :
    <ul>
    <li>Ubuntu
    <li>Edubuntu
    <li>Kubuntu
    <li>Xubuntu
    </ul>
    17

    XHTML, :
    <ul>
    <li>Ubuntu</li>
    <li>Edubuntu</li>
    <li>Kubuntu</li>
    <li>Xubuntu</li>
    </ul>

    1.6.5

    , . , , :
    <table width="100%">
    :
    <table width=100%>
    XHTML . . , ( ).
    , .
    , :
    <input checked>

    <option selected>
    :
    <input checked="checked" />

    <option selected="selected" />.


    18

    1.6.6

    id name

    A name, HTML
    : a, frame, img ., XHTML . j
    , id.
    , :
    <img src="tux.gif" name="tux" />
    :
    <img src="tux.gif" id="tux" />
    , ,
    . , :
    <img src="tux.gif" id="tux" name="tux" />
    ,
    id.

    1.7

    lang

    XHTML, j , lang. j j, j
    .
    j ,
    xml:lang, :
    <div lang="no" xml:lang="no">No lang defined</div>
    j , j
    <html>. j ,
    , .
    HTML, j :
    19

    <html lang="en">
    ...
    </html>
    XHTML, :
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en"
    xml:lang="en">
    ...
    </html>

    1.8

    DOCTYPE
    XHTML

    :
    DOCTYPE j,
    <head>
    <body>.
    DOCTYPE j j
    .
    DOCTYPE XHTML ,
    XHTML .
    j XHTML , :
    STRICT,
    TRANSITIONAL
    FRAMESET.

    1.8.1

    XHTML 1.0 Strict

    <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    20

    XHTML , j,
    j . j
    j CSS.

    1.8.2

    XHTML 1.0 Transitional

    <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/
    xhtml1-transitional.dtd">
    j XHTML ,
    HTML , j .

    1.8.3

    XHTML 1.0 Frameset

    <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
    "http://www.w3.org/TR/xhtml1/DTD/
    xhtml1-frameset.dtd">
    (frames),
    j .

    1.9

    , XHTML
    (well formed ). j .
    j W3C.
    , j j j
    .
    21

    <form method="get" action="http://validator.w3.org/


    check" target="_blank">
    <p> j :</p>
    <p><input name="uri" size="60" /></p>
    <input type="submit" value="" />
    </form>

    ,
    j
    XHTML j.

    22


    j XHTML 1.0. ,
    .
    DTD j XHTML
    , . S Strict,
    T Transitional, F Frameset.
    , j CSS.

    <!DOCTYPE>
    <html>
    <body>
    <h1> <h6>
    <p>
    <br>
    <hr>
    <!--...-->


    html

    1 6

    ()
    j

    . A.1: (basic tags)

    23

    DTD
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF


    <head>
    <title>
    <meta>
    <base>
    <basefont>



    (meta)
    URL
    ( )

    DTD
    STF
    STF
    STF
    STF
    TF

    . A.2: (meta info)

    <b>
    <font>
    <i>
    <em>
    <big>
    <strong>
    <small>
    <sup>
    <sub>
    <bdo>
    <u>

    ( )

    (j )

    ( )

    ( )

    DTD
    STF
    TF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    TF

    . A.3: (text format)

    <ul>
    <ol>
    <li>
    <dir>
    <dl>
    <dt>
    <dd>
    <menu>

    j
    j
    j
    ( )
    ()

    (j)
    ( )
    . A.4: (lists)
    24

    DTD
    STF
    STF
    STF
    TF
    STF
    STF
    STF
    TF


    <pre>
    <code>
    <tt>
    <kbd>
    <var>
    <dfn>
    <samp>
    <xmp>

    j
    ( )
    ( ) XHTML

    DTD
    STF
    STF
    STF
    STF
    STF
    STF
    STF

    . A.5: (utput)

    <acronym>
    <abbr>
    <address>
    <blockquote>
    <center>
    <q>
    <cite>
    <ins>
    <del>
    <s>
    <strike>

    (abbreviation)


    ( )



    ( )
    ( )

    . A.6: (blocks)

    <a>
    <link>

    ()

    DTD
    STF
    STF

    . A.7: (links)

    25

    DTD
    STF
    STF
    STF
    STF
    TF
    STF
    STF
    STF
    STF
    TF
    TF


    <img>
    <map>
    <area>

    ,
    ,

    DTD
    STF
    STF
    STF

    . A.8: (images)

    <table>
    <caption>
    <th>
    <tr>
    <td>
    <thead>
    <tbody>
    <tfoot>
    <col>
    <colgroup>




    j
    (header )

    (footer )

    DTD
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF

    . A.9: (tables)

    <style>
    <div>
    <span>

    DTD
    STF
    STF
    STF

    . A.10: (styles)

    26


    <form>
    <input>
    <textarea>
    <button>
    <select>
    <optgroup>
    <option>
    <label>
    <fieldset>
    <legend>
    <isindex>

    ()
    j (j)



    ( )

    DTD
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    STF
    TF

    . A.11: (input)

    <frame>
    <frameset>
    <noframes>
    <iframe>

    DTD
    F
    F
    TF
    TF

    . A.12: (frames)

    <script>
    <noscript>
    <applet>
    <object>
    <param>


    ( ) (applet)
    j
    j

    DTD
    STF
    STF
    TF
    STF
    STF

    . A.13: (programming)

    27

    28

    ,
    HTML XHTML . . ,
    .

    class
    id
    style
    title

    classname
    id
    style
    text

    . B.1: (core attributes)


    , :
    base, head, html, meta, param, script, style title.
    j,
    : base, br, frame, frameset, hr, iframe, param script.
    HTML 4,
    . ,
    JavaScript
    j .
    ,
    29


    dir
    lang
    xml:lang

    ltr, rtl
    lang_code
    lang_code

    ()
    j
    j
    ( XHTML )

    . B.2: j (language attributes)

    accesskey
    tabindex

    character
    number

    . B.3: (keyboard attributes)


    HTML, XHTML ,
    j .
    , ,
    <body> <frameset>.
    ,
    .

    , : base, bdo, br, frame,
    frameset, head, html, iframe, meta, param, script, style title.
    ,
    , : base, bdo, br, frame, frameset,
    head, html, iframe, meta, param, script, style title.

    30


    onload
    onunload

    script
    script

    . B.4: (standard event attributes)

    onchange
    onsubmit
    onreset
    onselect
    onblur
    onfocus

    script
    script
    script
    script
    script
    script

    . B.5: (form events attributes)

    onkeydown
    onkeypress

    script
    script

    onkeyup

    script

    . B.6: (keyboard events attributes)

    onclick
    ondblclick
    onmousedown
    onmousemove
    onmouseover
    onmouseout
    onmouseup

    script
    script
    script
    script
    script
    script
    script

    . B.7: (mouse events attributes)


    31

    32

    , j e j
    j : (red ), (green)
    (blue).
    , .
    XHTML .
    , (, , .),
    j, .
    oj,
    j : # ().
    #RRGGBB

    (RR), (GG),
    j (BB).
    :
    #000000
    #ffffff
    #ff0000
    33

    #00ff00
    #0000ffF
    #ffff00
    #663300
    ,
    j
    . , j
    j, j.
    HTML, XHTML CSS,
    , 16 : aqua,
    black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple,
    red, silver, teal, white yellow.

    34


    [1] HTML j, J, , j,
    2003.
    [2] W3Schools (on-line edition).
    [3] Jennifer Niederst, Web Design in a Nutshell, OReilly & Associates, 1999.
    [4] Ian Lloyd, The Ultimate HTML Reference, SitePoint Pty Ltd,
    2008.
    [5] Tommy Olsson, Paul OBrien, The Ultimate CSS Reference, SitePoint Pty Ltd, 2008.

    35

    You might also like