900
Íèêîëàé Ïðîõîðåíîê Ñàíêò-Ïåòåðáóðã «ÁÕÂ-Ïåòåðáóðã» 2010

Прохоренок Н.А. - HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера - 2010

Embed Size (px)

Citation preview

  • -

    -

    2010

  • 681.3.06 32.973.26-018.2 84 . .

    84 HTML, JavaScript, PHP MySQL. Web-. 3- ., . . .: -, 2010. 912 .: . + ( CD-ROM) ( )

    ISBN 978-5-9775-0540-6 Web-

    HTML, JavaScript, PHP MySQL. - (CSS) Web-. - PHP, -, Web-. MySQL PHP, - phpMyAdmin.

    Web- Apache. 3- Apache 2.2.14,

    PHP 5.3.0 MySQL 5.1.40. Notepad++, Aptana Studio, NetBeans HeidiSQL, Smarty, .

    -

    , , ,

    Perl .

    Web-

    681.3.06 32.973.26-018.2

    :

    . . .

    02429 24.07.00. 30.01.10.

    701001/16. . . . . 73,53.

    2500 . "-", 190005, -, ., 29.

    - 77.99.60.953..005770.05.09 26.05.2009 .

    .

    " ""

    199034, -, 9 , 12

    ISBN 978-5-9775-0540-6 . ., 2010 , "-", 2010

  • .......................................................................................................................1

    1. HTML. ............................................5

    1.1. ..............................................................................................5 1.2. HTML- ...................................................................................9 1.3. ........................................................................................12

    1.3.1. HEAD. ...........................13 1.3.2. BODY. ...............................................15

    1.4. ...........................................................16 1.4.1. ..................................................................17 1.4.2. ....................................................17 1.4.3. ............................................................18

    1.5. ............................................................................19 1.5.1. ........................................................................................20 1.5.2. ..........................................................................................20 1.5.3. ...............................................................................21 1.5.4. ....................................................................................................22 1.5.5. ................................................................................22

    1.6. ................................................................................................................23 1.6.1. .............................................................................23 1.6.2. ...............................................................................24 1.6.3. ..................................................................................26

    1.7. ..............................................................................................................27 1.7.1. Web- ................................................................27 1.7.2. ..................................................................29

    1.8. ......................................................................................................30 1.8.1. ...............................................................................30 1.8.2. ..........................................................................32 1.8.3. .............................................33

    1.9. .............................................................................................................34 1.9.1. ....................................................................35 1.9.2. .....................................................................................36 1.9.3. .........................................................................................36 1.9.4. .........................................................................................37

  • IV

    1.10. ............................................................................................................40 1.10.1. Web- .......................40 1.10.2. HTML-, ...........................44 1.10.3. ............................................................45 1.10.4. ...............................................................46 1.10.5. ........................................................................................47 1.10.6. .........................................47 1.10.7. . ....................48

    1.11. - ........................................................................................50 1.11.1. - ............................................51 1.11.2. -..................................................................52 1.11.3. ................................................................................................53 1.11.4. -.............................53

    1.12. ..............................................................................................................55 1.12.1. ...............................................55 1.12.2. ............................................................57 1.12.3. ..............................................................57 1.12.4. ............................................................59 1.12.5. ...............................................................................................64 1.12.6. ..............................................................67

    1.13. . ..........................67 1.14. XHTML 1.0 HTML 4.01 .............................................................69 1.15. HTML- ........................73 1.16. Web- Internet Explorer .....................................74

    2. CSS. WEB- .................................................................................................77

    2.1. ............................................................................................77 2.2. ......................................................78

    2.2.1. ......................................................78 2.2.2. HTML- ........78 2.2.3. .......................................83 2.2.4. .................................................................85

    2.3. CSS...............................................................................87 2.4. .................................................................................88

    2.4.1. ................................................................................................88 2.4.2. .............................................................................................89 2.4.3. ...........................................................................................89 2.4.4. ...............................................................................................89 2.4.5. ......................................................................................90

  • V

    2.5. ....................................................................................90 2.5.1. ...................................................90 2.5.2. .......................................................................90 2.5.3. ................................................................................91 2.5.4. .............................................91 2.5.5. .....................................................91 2.5.6. .........................................................92 2.5.7. , .........................92 2.5.8. ..................................................................93 2.5.9. .......................................................93

    2.6. .............................................................................................................94 2.6.1. .......................................................................................94 2.6.2. ..................................................................................95

    2.7. ..................................................................................................................96 2.7.1. ....................................................................................96 2.7.2. ...............................................................................98 2.7.3. ......................................................................................98 2.7.4. ..............................................99

    2.8. .....................................................................................................99 2.8.1. ....................................................................................................99 2.8.2. .....................................................................................100 2.8.3. .........................................................100 2.8.4. .................................................................100 2.8.5. ................................................................101 2.8.6. ..............................................101

    2.9. ..............................................................................................................102 2.9.1. .................................................................................102 2.9.2. ...............................................102 2.9.3. ...........................................................103

    2.10. ...................................................................................................103 2.11. . ......104 2.12. ..............................................................................106

    2.12.1. ..............................................................................106 2.12.2. ...............................................................................108 2.12.3. overflow ....................................................................................109 2.12.4. ........................................................................111 2.12.5. ......................................................................113 2.12.6. .............................................115

    2.13. ..........................................................117 2.14. CSS- ......................................119

  • VI

    3. JAVASCRIPT. , ..............121

    3.1. ..........................................................................................121 3.2. JavaScript ....................................................................121 3.3. JavaScript ..............................................................................124 3.4. ..............................124

    3.4.1. OK ........................................................125 3.4.2. OK Cancel.......................................126 3.4.3. OK Cancel.......................................127

    3.5. .....................................................................................................127 3.6. . ...............................................................128 3.7. JavaScript......................................................................................130

    3.7.1. ....................................................................130 3.7.2. ........................................................................132 3.7.3. ...............................................................................132 3.7.4. ......................................................................133 3.7.5. .......................................................134

    3.8. ......................................................................135 3.9. . .................................................................................................138 3.10. .........................................................................................................139 3.11. . ......................................142

    3.11.1. .................................................................................142 3.11.2. HTML-.............................144 3.11.3. . ......................................................146 3.11.4. .................................................147

    3.12. . ....................................................................................149

    3.12.1. ............................................................................149 3.12.2. ifelse. ..............150 3.12.3. ? .............................................153 3.12.4. switch.........................................................................154

    3.13. . ....................156 3.13.1. for ...................................................................................................156 3.13.2. while ...............................................................................................158 3.13.3. dowhile .......................................................................................159 3.13.4. continue. ...........160 3.13.5. break. .....................................................160

  • VII

    3.14. ....................................................................................161 3.14.1. .......................................................................161 3.14.2. ...............................................................................162 3.14.3. ..............................................................162 3.14.4. .................................................................................163 3.14.5. Firebug Web- Firefox...........................................164

    3.15. JavaScript .....................................................................167 3.15.1. .................................................................................167 3.15.2. Global ...........................................................................................168 3.15.3. Number. ..........................................................170 3.15.4. String. ..............................................................171 3.15.5. Array. .............................173 3.15.6. Math. .....................180 3.15.7. Date. . Web- ..................................................182 3.15.8. Function () .....................................................................186 3.15.9. Arguments. ..........................................................................................................187 3.15.10. RegExp. ..........................................................................................................188

    3.16. .........................................................................................................199 3.16.1. .................................................................................199 3.16.2. .......................................................................................199 3.16.3. ..............................................................................200 3.16.4. ................................................................................200 3.16.5. ......................................................................................201 3.16.6. ...............................................................201 3.16.7. .............................................................................203 3.16.8. ...................................................205 3.16.9. .......................................................207 3.16.10. event. . ..................214

    3.17. Microsoft Internet Explorer ............................................220 3.17.1. ...............................................................220 3.17.2. window. Web-......................................................................................................221 3.17.3. . , ........................................................227 3.17.4. . ..............................................................231 3.17.5. . Web- .......................................234

  • VIII

    3.17.6. navigator. Web- .

    Web-........................................................................236 3.17.7. screen. .......................................................................................................241 3.17.8. location. URL- . HTML- ............................................242 3.17.9. history. .

    ..............................................................................................................247 3.17.10. document. HTML- ............................................................................................248 3.17.11. . ...............................................................255 3.17.12. . URL- . ..........................257 3.17.13. style. JavaScript.............................................................................................................265 3.17.14. selection. ........268 3.17.15. TextRange. . ...........272 3.17.16. .

    ...................................................................................................282 3.17.17. " " " ".....................................................................284 3.17.18. . cookies. cookies ..............................................................................................................285

    3.18. ........................................................................289 3.18.1. ............................................................................290 3.18.2. Forms. ..................291 3.18.3. ......................................................................291 3.18.4. .........................................................................292 3.18.5. .......................................................................292 3.18.6. . E-mail . ....................292 3.18.7. . ..............................................................295 3.18.8. . . ............................298

  • IX

    3.18.9. . ...............303 3.18.10. . . .

    .......................................................................................306 3.18.11. . .......................................................................................................309

    3.19. ..........................................................................314 3.19.1. .................................................................................314 3.19.2. ..............................................................................................318 3.19.3. ................................................................................321

    3.20. JavaScript-...................................................................................323

    4. WEB-. WINDOWS ......................325

    4.1. ..............................................................................325 4.2. Apache .............................................................................326 4.3. Apache............................................................333 4.4. httpd.conf ......................................................................334

    4.4.1. ...................................................................................334 4.4.2. .................................................................335 4.4.3. . , http://localhost/~nik/ ....................................................337 4.4.4. .....................................339 4.4.5. ...............................340 4.4.6. .................................................................341 4.4.7. ..................................................................341 4.4.8. ...................................................................................342 4.4.9. MIME- ..........................................................................343 4.4.10. ..........................................................345 4.4.11. ..............................................................348 4.4.12. .htaccess. Apache ...............................................................................................350 4.4.13. ...................................................351 4.4.14. ............................................................................355 4.4.15. , ........................356 4.4.16. ..........................................................357

    4.5. Apache .............................................................................360 4.6. PHP ................................................................................................362 4.7. MySQL...........................................................................................370

  • X

    4.8. phpMyAdmin .................................................................................379 4.9. ...................................................................................385

    4.9.1. ...................................................................................385 4.9.2. ....................................................................393 4.9.3. ................................................................393 4.9.4. ......................................................395

    4.10. PHP Expert Editor ..................................................395 4.11. Aptana Studio .........................................................401 4.12. NetBeans.................................................................412 4.13. HeidiSQL....................................................................................418

    5. PHP. WEB- ............421

    5.1. ..........................................................................................421 5.2. PHP .............................................................................421 5.3. PHP- .....................................................................425 5.4. PHP-.....................................................................426 5.5. ..............................................................427 5.6. .....................................................................................................429 5.7. ...............................................429 5.8. ..........................................................431 5.9. ....................................................................................432 5.10. . ......................................433 5.11. PHP.............................................................................................434

    5.11.1. ..................................................................435 5.11.2. ......................................................................436 5.11.3. .............................................................................436 5.11.4. . . .........................................................437 5.11.5. .....................................................440

    5.12. ....................................................................441 5.13. .................................................................................443 5.14. .........................................................................................................444

    5.14.1. ........................................................................444 5.14.2. . ..................................................444 5.14.3. ..........................................................................445 5.14.4. .......................................................................445 5.14.5. ..................................................................................447 5.14.6. ..................................................................447 5.14.7. ........................................451

  • XI

    5.14.8. ......................................452 5.14.9. . ........453 5.14.10. ....................................................................455 5.14.11. ..............................................456 5.14.12. ............................................456 5.14.13. ..............................................................457 5.14.14. ......................................................458 5.14.15. ..............................................459

    5.15. ............................................................................................................460 5.15.1. ........................................................460 5.15.2. ...................................................................................465 5.15.3. .......................................................466 5.15.4. ........................................................................466 5.15.5. ..............................................................467 5.15.6. ................................................................................468 5.15.7. ...................................................................469 5.15.8. . . ....................470 5.15.9. Perl- ..........................................478 5.15.10. UTF-8.....................487 5.15.11. .........................................................496

    5.16. ...................................................................497 5.17. . ,

    ..............................................................................499 5.18. . ......................................503

    5.18.1. .................................................................................503 5.18.2. ........................................................505 5.18.3. require include. . .....................506 5.18.4. require_once include_once...............................................509 5.18.5. . .........................................................510 5.18.6. . . .........510 5.18.7. ......................................................................514 5.18.8. . ................................................................................................515

    5.19. . ....................................................................................516

    5.19.1. ............................................................................516 5.19.2. ifelse. .............................................................................................................518

  • XII

    5.19.3. ? .............................................520 5.19.4. switch. switch ifelse .....................................................................................................522

    5.20. . ....................524 5.20.1. for ...................................................................................................524 5.20.2. while ...............................................................................................526 5.20.3. dowhile .......................................................................................526 5.20.4. foreach ...........................................................................................527 5.20.5. continue. ...........528 5.20.6. break. .....................................................529

    5.21. . .................................................................................................529 5.22. ....................................................................................531

    5.22.1. .......................................................................531 5.22.2. ...............................................................................532 5.22.3. ..............................................................532 5.22.4. .................................................................................532 5.22.5. or die() ................................................................................534

    5.23. ...............................................................................534 5.23.1. $GLOBALS ................................................................................535 5.23.2. .....................................538

    5.24. HTTP............................................................................................539 5.24.1. ..............................................................................542 5.24.2. . URL-. . . , ............................544 5.24.3. cookies. .....548

    5.25. ...................................................................549 5.25.1. .................................................................................549 5.25.2. . , , ................................................................550 5.25.3. ..................................................................554 5.25.4. , E-mail- .............................................................555 5.25.5. CSV-. CSV- HTML- ................................................................................................560 5.25.6. UNIX...................................562 5.25.7. ............................................564 5.25.8. ....................................................................566 5.25.9. . ..............................568 5.25.10. ........................................572

  • XIII

    5.26. . E-mail- ..................................................................................................................583 5.27. PHP. .............587 5.28. .........................................................................................592

    5.28.1. GD.................................592 5.28.2. ............................................593 5.28.3. ......................................................597 5.28.4. .............................................................599 5.28.5. ......................................................................................600 5.28.6. ......................................................................602 5.28.7. . ..............604 5.28.8. .............................609

    5.29. ............................................................................612 5.29.1. , ...........................612 5.29.2. ...............................................613 5.29.3. ......................................................613 5.29.4. ....................................................................................................615 5.29.5. - ........................................................................616 5.29.6. Submit.........................................................................................616 5.29.7. . .......................................................................................................617

    5.30. ...........................................................................622 5.30.1. ..............................................623 5.30.2. ........................................623 5.30.3. .........................................623 5.30.4. ...............................................................................624 5.30.5. .......625 5.30.6. , ....................................627

    5.31. - .......................................627 5.31.1. .....................................................................................628 5.31.2. .....................................................................629 5.31.3. .........................................................................................631 5.31.4. ...........................................................633 5.31.5. ....................................................634 5.31.6. .........................................................634 5.31.7. .....................................637

    5.32. Smarty...................................................................................639 5.32.1. ..........................................................................639 5.32.2. ..................................................................643 5.32.3. .................................................................649 5.32.4. ...........................................................................654

  • XIV

    6. MYSQL. ..............................661 6.1. ..........................................................................................661 6.2. ...........................................................................661 6.3. ........................................................................................665

    6.3.1. .........................................................................................666 6.3.2. .......................................................................................666 6.3.3. .............................................................................................667

    6.4. SQL..........................................................................................668 6.4.1. ............................................................................668 6.4.2. .....................................................669 6.4.3. ....................................................................................671 6.4.4. ......................................................................674 6.4.5. ................................................................................677 6.4.6. ................................................................678 6.4.7. ...................................................................679 6.4.8. ..........................................................................................680 6.4.9. ....................................................682 6.4.10. . ........................................687 6.4.11. ........................................................692

    6.5. PHP php_mysql.dll .......693 6.5.1. .............................................................................693 6.5.2. .................................................................................694 6.5.3. .......................................................694 6.5.4. ................................................................695

    6.6. PHP php_mysqli.dll......702 6.6.1. .............................................................................702 6.6.2. .................................................................................704 6.6.3. .......................................................704 6.6.4. ................................................................706

    6.7. MySQL .........................................................................................714 6.7.1. ....................................................................715 6.7.2. ...............................................................................717 6.7.3. ..............................................................................717 6.7.4. .......................................................719 6.7.5. ...............................................................720

    6.8. ..........................................................................................721 6.9. ..................................................725 6.10. ..................................................................729

    6.10.1. FULLTEXT...............................................................729 6.10.2. ....................................................731

  • XV

    6.10.3. ...................................................................732 6.10.4. ..............................................................733

    6.11. MySQL...........................................................................................733 6.11.1. ............................................................733 6.11.2. ......................................................................738 6.11.3. ..............................................................750 6.11.4. ..........................................................757 6.11.5. ...................................................................758 6.11.6. .....................................................................................760

    6.12. SQL ..........................................................................................764 6.13. .....................................................................................765 6.14. .....................................................................................767

    6.14.1. ......................768 6.14.2. WHERE .................770

    6.15. .............................................................................................772

    7. . ..........775

    7.1. ...........................................................................................775 7.2. ................................................................................776 7.3. .................................................................................................779 7.4. Narod.ru ........................................................................780

    7.4.1. .......................................................781 7.4.2. " "....................................................782 7.4.3. ...................................................................784 7.4.4. , ..................................786

    7.5. .....................................................................791 7.5.1. ..........................................................................791 7.5.2. .......................................................792 7.5.3. .............................................................793 7.5.4. ..............796 7.5.5. Web- Apache .htaccess ..............804 7.5.6. favicon.ico........................................................................................806 7.5.7. Web- Apache............807 7.5.8. .....................................809 7.5.9. MySQL...............................................................812 7.5.10. phpMyAdmin.........................813 7.5.11. .........................................................................817 7.5.12. ....................................818 7.5.13. .........................820

  • XVI

    7.6. ...............................................................................................823 7.6.1. ...............................................823 7.6.2. robots.txt ..........................................................................................824 7.6.3. ....................................................825 7.6.4. ........................................................827 7.6.5. Web-........................................................827

    7.7. ..............................................................................................828 7.7.1. .........................................................................828 7.7.2. ........................................................................................830 7.7.3. ................................................................................831

    7.8. .............................................................................832

    . - .....................................................835

    .1. ...................................................................................................835 .1.1. HTML .......................................................................................................836 .1.2. ........................................................................844 .1.3. Flash ..........................................................................................................851 .1.4. PHP MySQL..........................................................................................859 .1.5. ................................................................................................862

    ....................................................................................869

  • ,

    HTML, CSS, JavaScript, PHP MySQL, .

    (HTML, CSS, JavaScript), (PHP, MySQL). , ,

    , .

    -

    . Web-, . 7, . -

    ,

    HTML. - , .

    ? - , .

    HTML, 1, - Web- Web-. HTML ,

    , , -

    -, Web- -, .

    (CSS), 2, Web-. Web- Web- Web- - .

    Web-, HTML CSS, - , ,

    . HTML JavaScript "" Web-, , , , .

  • 2

    JavaScript , - Web- - , ,

    HTML- - , Web-, , Web- -. , 3. ,

    PHP. -

    . ( , - Web-), HTML-, Web-, , Web- . - , -

    PHP . PHP , - , ,

    , ,

    , , , - .

    PHP 5.

    4 , - PHP. -

    . ,

    . , 4 - , -

    .

    -

    . Web- , -

    () MySQL. MySQL , , . -

    MySQL 6. PHP MySQL, Microsoft SQL Server, Oracle, Sybase . MySQL, , .

  • 3

    7 , . , , -

    FTP , Apache, - , . .

    7 Web- . - - , -

    Web- Internet Explorer, - Perl. , - -

    . -

    ,

    PHP, , Apache. .

    -. -

    -

    .

    .

    Web-.

    http://wwwadmin.ru/. E-mail [email protected]. , -

    .

  • 1

    HTML.

    1.1. HTML (HyperText Markup Language) , - .

    -

    , ,

    . . -

    . ,

    , -

    . HTML :

    , , , .

    . - . "", . -

    , () - (). ("/") . , , -

    , .

    ( ). -

  • 1

    6

    ="". ,

    . :

    http-equiv Con-tent-Type, content text/html; charset=windows-1251.

    . :

    -

    . , :

    HTML , XHTML .

    HTML- , Web-. Web- , ,

    .

    HTML-, Web-, Web-. HTML- Web- , , ,

    , . .

    , Web- - HTML-.

    HTML html htm. HTML, FCKeditor tinyMCE. JavaScript Web-. FCKeditor http://ckeditor.com/download. sample07.html ( fckeditor\_samples\html\). Web- Firefox, :

    1. about:config .

  • HTML.

    7

    2. security.fileuri.strict_origin_policy false.

    . 1.1 , FCKeditor, Web- Firefox. Mi-crosoft Word, -. FCKeditor , Word. - HTML-. HTML- (. 1.2). , - HTML- . tinyMCE http://tinymce.moxiecode.com/ download.php. . http://tinymce.moxiecode.com/ download_i18n.php -. tinymce\jscripts\tiny_mce\, - .

    . ,

    full.html ( tinymce\examples\) language: "ru",

    tinyMCE.init({

    . 1.1. FCKeditor, Web- Firefox

  • 1

    8

    full.html Web-. . 1.3 - , tinyMCE, Web- Firefox.

    . 1.2. FCKeditor

    . 1.3. tinyMCE, Web- Firefox

  • HTML.

    9

    1.2. HTML- HTML-. .

    . -

    1.1.

    1.1. HTML-

    HTML, , test.html. .

    "test.html", - . , , , -

    . .

    (*.txt), , - txt.

    Web-, , Internet Explorer. - test.html. , Web- "

  • 1

    10

    ",

    " Microsoft Internet Explorer". Web- ! Web-. - HTML. :

    HTML-; Web-.

    HTML-;

    . Web- HTML-, Web-, HTML-. - HTML-, , - HTML- . .

    , , - . .

    .

    .

    Web-

    ( , ). Web- Web-. : ; ; ; . " Web- Microsoft Internet Explorer".

  • HTML.

    11

    , - , -

    . : - , , , Web-.

    , HTML-. HTML- - , , .

    Notepad++. windows-1251, - UTF-8, HTML, JavaScript, PHP .

    .

    Notepad++ http://notepad-plus.sourceforge.net/ru/site.htm. (ZIP- ) , . Notepad++ .

    Notepad++. ANSI. , 1.1, .

    "test.html". , , , . Web-.

    - ,

    -

    Windows Edit with Note-pad++.

    Notepad++ PHP Expert Editor, Aptana Studio NetBeans. . Notepad++. - 4.

  • 1

    12

    1.3. , HTML-, -, .

    HTML. 1.2 , HTML-.

    1.2. HTML-

    Web- . HTML 4.01: Strict . ,

    . :

    Transitional . HTML. - :

    Frameset , . :

    , Web- Internet Explorer (Quirks Mode).

  • HTML.

    13

    . Web- - - Web-.

    W3C http://www.w3.org/TR/CSS2/ box.html http://www.quirksmode.org/css/quirksmode.html.

    HTML- . HTML- ( ) ( ).

    1.3.1. HEAD. HEAD ,

    , -

    , , . .

    HEAD . , , - Web-. 60 , Web-:

    -, , . - . - " ", " " . .

    .

    , :

  • 1

    14

    . -

    lang :

    , Web- :

    content :

    index ; noindex ; follow ,

    Web-; nofollow ; all index follow; none noindex nofollow. . :

    , :

    :

    :

    refresh :

    30 . - ,

    URL- url:

  • HTML.

    15

    HEAD , , , . .

    1.3.2. BODY. . -

    , ,

    .

    , Strict , , , .:

    :

    bgcolor Web-. - , .

    . -

    (, ) - 00 FF. , - "#", , #FF0000 , #00FF00 -, #FF00FF ( );

    background - URL- ;

    alink ; link ; vlink ; text . , :

    PetruEvideniereParametrii tag-ului

  • 1

    16

    Transitional. - Strict .

    ,

    .

    1.4. , HTML . , , .

    , -

    . , , (), HTML-.

    HTML-. , , .

    , .

    () >. HTML-: < ();

    PetruEvideniereAtenie

    PetruEvideniereHTML-echivaleni utlizai frecvent

  • HTML.

    17

    & (&); ; " ("); (); (); ().

    1.4.1. :

    :

    : ,

    : ,

    :

    :

    , Transitional. Strict .

    1.4.2. . , , 2:

    H2O

    PetruEvideniereEvidenierea textului

  • 1

    18

    .

    , , 2:

    2

    1.4.3. , . -:

    face :

    , , .

    . -

    .

    ,

    ;

    size 1 7. , - Web- , 3. 1 7, - , , ( "+") ( "") :

    color . , bgcolor (. . 1.3.2):

    :

    :

    black #000000 ;

    white #FFFFFF ;

    yellow #FFFF00 ;

    silver #C0C0C0 ;

    PetruEvideniereParametrii tag-ului

  • HTML.

    19

    red #FF0000 ;

    green #008000 ;

    gray #808080 -;

    blue #0000FF ;

    navy #000080 -;

    purple #800080 .

    Transitional. Strict .

    .

    :

    :

    :

    1.5. , , -

    . . -

    -

    . -

    Web- -. :

    , ;

    ; ;

    PetruEvideniereAtenie

    PetruEvideniereAlte tag-uri pentru formatarea textului

    PetruEvideniereTag-uri principale pentru formatarea logic

  • 1

    20

    -;

    ; ,

    ;

    .

    1.5.1. , , Web-. , ,

    , -

    :

    - . Web-.

    1.5.2. .

    HTML- 1

    2

    3

    Web- : "1 2 3". ,

    :

    1

    2

    3

    , , -

    :

    PetruEvideniereTag-ul pentru comentarii

  • HTML.

    21

    1

    2

    3

    .

    1.5.3. .

    :

    size :

    width . , Web-:

    align . :

    center ( ):

    left :

    right :

    noshade :

    - Transitional. Strict .

    PetruEvideniereLinie orizontal

    PetruEvideniereParametrii tag-ului

    PetruEvideniereAtenie

  • 1

    22

    1.5.4. :

    x 1 6. 1 :

    6 :

    align, Web-. : center :

    left ( ):

    right :

    align Transitional. Strict .

    1.5.5. . Web- - . -.

    align, -. :

    center :

    PetruEvideniereAliniate

  • HTML.

    23

    left ( ):

    right :

    justify ( ):

    align Transitional. Strict .

    1.6. , -

    ( ) ( -). .

    1.6.1. . . . 1.3 .

    1.3.

    type, , - . :

    disc :

    PetruEvideniereListe

  • 1

    24

    circle :

    square :

    type Transitional. Strict .

    1.6.2. . - . .

    1.4 .

    1.4.

    . type , .

    PetruEvideniereListe numerotate

  • HTML.

    25

    :

    A :

    a :

    I :

    i :

    1 ( ):

    start , -

    :

  • 1

    26

    value, :

    " " 1, " " - 5, " " 6.

    type, start value Transitional. Strict -.

    1.6.3. /. - . , . . 1.5.

    1.5.

    HTML (HyperText Markup Language)

  • HTML.

    27

    ,

    CSS (Cascading Style Sheets)

    1.7. Web- . - . -

    :

    GIF 256 . - , GIF- ;

    JPEG . ;

    PNG , . .

    GIF.

    - Web-. , .

    1.7.1. Web- Web- . , -, , . :

    src URL- :

    PetruEvideniereImagini pe o pagin Web

  • 1

    28

    alt , - ,

    . ,

    , alt, :

    width :

    height :

    width height . Web- -. , . , .

    width height, - Web- Web- -. - , Web-. Web- .

    Transitional:

    border :

    align Web-. -:

    left , :

    PetruEvideniereParametrii tag-ului

  • HTML.

    29

    right , - :

    top :

    bottom :

    middle - :

    hspace :

    vspace :

    1.7.2. background -:

    bgcolor , -, , , -

    ,

    .

  • 1

    30

    - Transitional. Strict .

    1.8.

    . Web- .

    1.8.1. HTML- . , , ,

    .

    href.

    URL- Web-, .

    URL- "&", HTML- &:

    HTML- , -, , . . Web- , .

    URL- .

    PetruEvideniere

    PetruEvideniereAdresele URL

  • HTML.

    31

    URL- URL- , IP- , , . :

    http://www.mysite.ru/folder/file.html

    , :

    http://www.mysite.ru/file.html

    . Web-, Web-: http://www.mysite.ru/ http://www.mysite.ru/folder/

    URL- URL- - Web-, . :

    Web- , Web-, , URL- . Web-, http://www.mysite.ru/folder1/folder2/file1.html, http://www.mysite.ru/folder1/folder2/file2.html, :

    Web-, http://www.mysite.ru/ folder1/folder2/file1.html, http://www.mysite.ru/ folder1/folder2/folder3/file2.html, :

    Web-, http://www.mysite.ru/ folder1/folder2/file1.html, http://www.mysite.ru/ folder1/file2.html, :

    http://www.mysite.ru/folder1/folder2/folder3/file1.html http://www.mysite.ru/folder1/file2.html :

    PetruEvideniereURL

    PetruEvideniereurl

  • 1

    32

    Web-. target _blank:

    target (. . 1.10.6).

    target Strict .

    1.8.2. -

    Web-. , .

    href , URL-. #: 1

    , href - name, :

    "". ""

    . :

    1.6.

    1.6.

    PetruEvidenieretarget:_blank

    PetruEvideniere

    PetruEvideniereURL-uri interne

    PetruEvideniere

    PetruEvideniere

  • HTML.

    33

    1 2 3 4 1 1 2 2 3 3 4 4

    1.8.3. :

    URL- , "mailto:".

    . , E-mail .

    PetruEvideniereURL spre e-mail

  • 1

    34

    1.9. HTML- :

    ; ,

    .

    , ( 1.7).

    1.7. HTML-

    1 2

    3 4

    22 . - . 1 4.

    HTML- . , - . .

    . , - . -.

    PetruEvideniereTabeluri

  • HTML.

    35

    1.9.1. :

    border , . :

    cellspacing , -, .

    2. 0, - :

    cellpadding :

    1; width -

    :

    Transitional:

    align , . :

    left , :

    right , :

    center :

    PetruEvideniereParametrii tag-ului

    PetruEvideniere

  • 1

    36

    bgcolor :

    1.9.2. . align. :

    top :

    bottom :

    align Transitional. Strict .

    1.9.3. . -

    :

    align . :

    left ( ):

    right :

    center :

    justify :

    PetruEvideniere

    PetruEvideniere

    PetruEvideniere

  • HTML.

    37

    valign . :

    top :

    middle :

    bottom :

    baseline :

    bgcolor . - Transitional. Strict .

    1.9.4. . - :

    align valign , ; width height

    ;

    bgcolor ;

    width, height bgcolor - Transitional. Strict .

    colspan ; rowspan . -

    ( 1.7) 1 2 ( 1.8).

    PetruEvideniere

    PetruEvideniere

  • 1

    38

    1.8.

    1 2

    3 4

    ,

    1

    1 2

    2

    .

    1 3 (- 1.9).

    1.9.

    1 3 2

    4

    PetruEvideniereUnirea celulelor pe orizontal

    PetruEvideniereUnirea celulelor pe vertical

  • HTML.

    39

    1

    1 3

    3

    .

    , . -

    . . 1.10 - .

    1.10.

    PetruEvideniereEvidenierea celulelor tabelului

  • 1

    40

    -2109 2008

    -412 1978

    1.10. Web- , HTML-.

    1.10.1. Web-

    , .

    ,

    , .

    , ,

    .

    Web- . 5 : doc1.html ( 1.11) Web-; doc2.html ( 1.12) ; chapter1.html ( 1.13) 1;

    PetruEvideniereFrame-uri

  • HTML.

    41

    chapter2.html ( 1.14) 2; test.html ( 1.15) HTML-,

    .

    1.11. HTML-, (doc1.html)

    1.12. HTML-, (doc2.html)

    1 2

  • 1

    42

    1.13. HTML-, 1 (chapter1.html)

    1

    1 1

    1.14. HTML-, 2 (chapter2.html)

    2

    2 2

    1.15. HTML-, (test.html)

  • HTML.

    43

    Web-

    . Web- test.html. , . - . -

    () (). , -

    .

    . -

    Web-. , Web- :

    HTML-; Web-.

    HTML-;

    , , .

    ,

    . Web-,

  • 1

    44

    HTML-. , - test.html. HTML-, , HTML- . - (doc1.html) , . -

    HTML-.

    Web-. - .

    , , . . , , , .

    1.10.2. HTML-, HTML- ( 1.16) - .

    1.16. HTML-

  • HTML.

    45

    Web-

    HTML-, , HEAD . HTML- BODY, , , .

    , BODY , HTML- -. ,

    Frameset. :

    , . . Web- , , . .

    1.10.3. . - , .

  • 1

    46

    :

    rows :

    cols :

    rows cols -. .

    . -

    ( ) : cols="20%, 80%"

    , -

    (*), , :

    rows="100, *"

    1.10.4. . :

    src URL- , . URL-:

    name :

    scrolling . :

    auto , - ( ):

    yes :

    no :

  • HTML.

    47

    marginwidth :

    marginheight :

    frameborder . :

    1 ( ):

    0 :

    noresize -. -

    . :

    1.10.5. Web- , , . . -

    :

    Web-

    1.10.6. target . target ( name ) : _blank Web-:

    PetruEvideniereframe noresize

    PetruEvideniere

    PetruEvidenierencrcarea documentului ntr-un frame anumit

    PetruEvideniere

  • 1

    48

    _self , -:

    _top :

    _parent , :

    chapter, :

    name :

    target Transitional.

    1.10.7. . HTML-. , . "". :

    src URL- , . URL-:

    name :

    scrolling . :

    auto , - ( ):

    PetruEvideniere

    PetruEvideniere

    PetruEvideniere

  • HTML.

    49

    yes :

    no :

    marginwidth marginheight ( ):

    frameborder . :

    1 :

    0 :

    width height :

    align . :

    left , :

    right , :

    top :

    middle :

    bottom :

    test.html ( 1.15) , - 1.17.

  • 1

    50

    1.17.

    Web-

    1 2

    , -

    ,

    .

    Transitional. - Strict .

    1.11. - - -

    . -

    GIF JPG.

    PetruEvideniereHart-imagine

  • HTML.

    51

    :

    Web- ; , -

    ;

    .

    1.11.1. - test.html ( - ) - ( 1.18).

    1.18. -

    -

    Web-

    PetruEvideniereLucru interesant, utlizarea hrilor-imagine

  • 1

    52

    ,

    . Web-, - border 1. Web-. , , ,

    120240 ( - ). .

    , , ,

    " 2". chapter2.html . , " 1".

    1.11.2. - , -

    HTML- ( 1.19).

    1.19. -

    PetruEvideniereStructura hrii-imagine

  • HTML.

    53

    , - .

    Web-. usemap , . URL- . HTML-, - , "#". , , -

    . . ,

    .

    1.11.3. -. name. name usemap .

    1.11.4. - .

    . , -

    .

    :

    shape . 4 : rect ( -

    ):

    circle :

    poly :

    default . Internet Explorer:

    PetruEvideniereTag-ul

    PetruEvideniere

    PetruEvideniere

  • 1

    54

    coords . -

    :

    rect - ( ):

    x1 y1 , x2 y2 - , :

    circle -:

    x1 y1 , r1 , -:

    poly :

    x1, y1, x2, y2, x3, y3 ( ). - , , -

    . -

    :

    href URL- . :

    nohref , . :

  • HTML.

    55

    120240 60 ; alt

    :

    target , . -

    _blank, _top, _self _parent:

    (. . 1.10.6).

    target Strict .

    1.12. Web-. , , -

    PHP. HTML .

    1.12.1. . -

    , 1.20.

    1.20.

    PetruComentariu pt. textForm-uri

  • 1

    56

    : : URL- : : : : 1 2 3 88*31:

    forma.html Web-. Web- , (, , URL- , ), ( ), -

  • HTML.

    57

    ( " 88*31:"), .

    . -

    , , - (URL- action , file.php), Web-. - -

    , ,

    . -

    , , ,

    " ".

    1.12.2. HTML- . , , :

    .

    1.12.3. HTML-. :

    action URL- . - :

    PetruEvideniereStructura documentului ce conine form-uri

    PetruComentariu pt. textParametrii tag-ului

  • 1

    58

    method , Web-. GET POST:

    GET URL- "?" [ ]=[ ]

    = -

    (&). : http://www.mysite.ru/file.php?pole1=Login&pole2=Password

    , ,

    (, ), %nn, - "+". , " " :

    %EA%E0%F2%E0%EB%EE%E3+%F1%E0%E9%F2%EE%E2

    pole1, :

    http://www.mysite.ru/file.php?pole1= %EA%E0%F2%E0%EB%EE%E3+%F1%E0%E9%F2%EE%E2&pole2=Password

    GET method :

    GET , , URL-. - 256 ;

    POST , (, ):

    enctype MIME- . :

    application/x-www-form-urlencoded :

    multipart/form-data Web- :

    PetruComentariu pt. textCodarea caracterelor nonlatine

  • HTML.

    59

    name :

    target , , - Web-. _blank, _top, _self _parent:

    .

    target Strict .

    1.12.4. , , , . :

    type . - :

    text :

    password , - :

    file . - Web-:

    checkbox , :

    radio - ( -):

    PetruEvideniere

  • 1

    60

    reset , . , :

    submit , , :

    button :

    . , 3; hidden ,

    . ,

    , , ( ) - :

    name . - (, pole) (, pole1). :

    disabled . :

    . -

    .

    :

    value :

    maxlength , :

    PetruEvideniere

  • HTML.

    61

    size :

    readonly , . :

    , :

    value , :

    hidden :

    value :

    - :

    value , Web-, - . , .

    , on:

    checked , :

    checkbox . name. -

    ( PHP): 1 2 3

    PetruEvideniere

  • 1

    62

    - - :

    value , Web-, :

    , ;

    checked , :

    - -

    , . -

    name value:

    :

    - :

    Web- - .

    :

    name :

    cols :

    PetruEvideniere

    PetruComentariu pt. textRegiunea pentru text

  • HTML.

    63

    rows :

    :

    1 2

    :

    name :

    size :

    size 1; multiple , -

    . -

    ( PHP):

    , - .

    :

    value , Web-, . , :

    1 2

    "1", select1="val1"

    PetruComentariu pt. textList

    PetruEvideniere

  • 1

    64

    "2", select1="2"

    selected , :

    1 2

    . label:

    BMW Opel Audi

    1.12.5. - . :

    for , .

    id : *:

    id . .

    PetruComentariu pt. textUnirea punctelor n grupuri

  • HTML.

    65

    , for:

    *:

    accesskey . : *:

    Opera Firefox accesskey.

    (- 1.21), CSS - .

    1.21.

    body { /* */ font-size: 10pt; /* */ font-family: "Verdana", sans-serif; /* */ } label { /* label */ display: inline-block; /* */ width: 150px; /* */ vertical-align: top; /* */ }

  • 1

    66

    select { /* */ width: 250px; /* */ border: 1px solid black; /* */ } input.pole { /* input, pole */ width: 250px; /* */ border: 1px solid black; /* */ } textarea { /* */ width: 250px; /* */ height: 100px; /* */ border: 1px solid black; /* */ } form div { /* div, form */ margin-bottom: 20px; /* */ }

    *: *: *: *: . . *:

  • HTML.

    67

    *: : *:

    1.12.6. . Web- .

    . :

    .

    .

    1.13. . . - ( 1.22). , Web-. - ,

    , , .

    PetruComentariu pt. textTag-urile i

  • 1

    68

    1.22.

    div { /* DIV */ font-size: 12pt; /* */ color: green; /* */ font-family: "Arial"; /* */ border: 1px solid black; /* */ padding: 5px; /* */ } span { /* SPAN */ font-size: 12pt; /* */ color: red; /* */ font-family: "Arial"; /* */ font-weight: bold; /* */ }

    DIV

    SPAN

  • HTML.

    69

    , , align. - :

    center :

    left :

    right :

    justify ( ):

    align Transitional. Strict .

    1.14. XHTML 1.0 HTML 4.01 XHTML (eXtensible HyperText Markup Language, ) Web-, XML. XHTML 1.0 HTML 4.01, - XML 1.0. HTML 4.01 Web-, - , . XHTML 1.0 . Web-, , - .

    XHTML 1.0: Strict . ,

    . :

    Transitional . HTML. - :

    PetruEvideniere

    PetruComentariu pt. textDiferena ntre XHTML 1.0 i HTML 4.01

  • 1

    70

    Frameset , . :

    , XHTML xmlns:

    lang - (lang="ru"). XML-

    , MIME- application/xhtml+xml. Web- Internet Explorer . XML- , MIME- text/html. XHTML .

    . :

    :

    . :

    :

    (, selected), .

    :

    1 2

  • HTML.

    71

    :

    1 2

    . :

    :

    (, , ) - (, , ). :

    :

    . :

    :

    (, , .) (" /"). :

  • 1

    72

    :

    HTML- (, "

  • HTML.

    73

    HTML- .

    1.15. HTML- HTML- .

    , , -

    . Web- -, .

    , Web- .

    (X)HTML- http://validator.w3.org/. , ,

    URL- Check. - HTML- . , .

    HTML-.

    PetruEvideniere

  • 1

    74

    1.16. Web- Internet Explorer , Internet Explorer , Web-. :

    , HTML-. W3C .

    -

    :

    lt ; lte ; gt ; gte ; ! . Web- Internet Explorer. 1.24.

    1.24. Web- Internet Explorer

    Web- Internet Explorer

    PetruEvideniere

  • HTML.

    75

    , Internet Explorer

    1.24 Internet Explorer 7.0 :

    Web- Internet Explorer

    7

    6

    6

    , ,

    .

  • 2

    CSS. Web-

    2.1. (CSS Cascading Style Sheets) - HTML - Web-. size :

    HTML 1 7. , Web- , 3. ? Web- - , Web- -

    CSS . style:

    Web-, , - Web- Web-. CSS, -.

    PetruEvideniereBazele CSS

    PetruComentariu pt. textCSS Parametrul style

  • 2

    78

    style (font-size: 12pt) - . (font-size) -. (12pt), . , HTML- , .

    2.2. : , HTML- - .

    2.2.1. style. , style :

    , -

    :

    - , -

    :

    2.2.2. HTML- ( 2.1). . HEAD HTML-. , , -

    class.

    PetruComentariu pt. textMetode de introducere a stilului

  • CSS. Web-

    79

    2.1.

    .text1 { font-size: 12pt; color: red; font-family: "Arial" } font { font-size: 12pt; color: green; font-family: "Arial" } font.text2 { font-size: 12pt; color: blue; font-family: "Arial" }

    1 2 3 4 5

    , , . , -

    :

    { : ; ..., : }

    :

    * . : * { margin: 0; padding: 0 }

    , : font { font-size: 12pt; color: green; font-family: "Arial" } ...

    2

    PetruEvideniere

  • 2

    80

    . , : .text1 { font-size: 12pt; color: red; font-family: "Arial" } ...

    1 2

    "1" "2" , ;

    . , : font.text2 { font-size: 12pt; color: blue } ...

    1

    , , -

    :

    2

    "2" , text2 ;

    # : #txt1 { color: red } ...

    # , : p#txt1 { color: red } ...

    , -

    .

    .

    :

    h1, h2 { font-family: "Arial" }

    :

    1 2 , -2, , 1:

    div a { color: red }

  • CSS. Web-

    81

    ,

    :

    1 > 2 , 2, , - 1:

    div > a { color: red }

    ,

    : 1 2

    , -

    ;

    Web- Internet Explorer , 7.0.

    1 + 2 , -2, , - 1, :

    div + a { color: red }

    ,

    div:

    Web- Internet Explorer , 8.0.

    :

    div span a { color: red }

    ,

    , : 1

  • 2

    82

    2

    2 . :

    [] : a[id] { color: red }

    , id: 1

    [=''] , :

    a[href="link1.html"] { color: red }

    , href "link1.html";

    [^=''] , :

    a[href^="li"] { color: red }

    , href "li";

    [$=''] , :

    a[href$=".html"] { color: red } , href ".html";

    [*=''] , - :

    a[href*="link"] { color: red }

    , href "link".

    :

    :first-letter . :

    p:first-letter { font-size: 150%; font-weight: bold; color: red }

    PetruEvideniere

  • CSS. Web-

    83

    :first-line . : p:first-line { font-weight: bold; color: red }

    :before :after .

    content:

    p:before { content: "before "; } p:after { content: " after"; } ...

    :

    before after

    Web- Internet Explorer :before :after 8.0.

    2.2.3. .

    css , , .

    , html. style.css ( 2.2) - test.html ( 2.3).

    2.2. style.css

    /* */ .text1 { /* class="text1" */ font-size: 12pt; /* */ color: red; /* */ font-family: Arial /* */ } font { /* FONT */ font-size: 12pt; /* */

    PetruComentariu pt. textIntroducerea stilului ntr-un fiier diferit

  • 2

    84

    color: green; /* */ font-family: Arial /* */ } font.text2 { /* FONT c class="text2" */ font-size: 12pt; /* */ color: blue; /* */ font-family: Arial /* */ }

    2.3. test.html

    1 2 3 4 5

    test.html Web-. , .

    HTML- - . href URL- , rel - stylesheet, , - :

  • CSS. Web-

    85

    CSS- @import: @import url()[ ]; @import [ ];

    @import: : @import url("style.css");

    ,

    . , all , print - . :

    @import "style.css" print;

    , , -

    HTML-.

    2.2.4. , color style , , ( 2.4) . , color ( 2.5).

    2.4. style.css

    p { color: red }

    2.5. test.html

  • 2

    86

    p { color: blue }

    1 2

    "1"? "2"? : , , , HTML-

    ;

    , , , style ;

    , , , .

    - -.

    , , -

    , , . -

    "1" , - color , . "2" , style, .

    , , , ,

    , , .

    :

    #id1 { color: red } .cls1 { color: blue } ...

    1

  • CSS. Web-

    87

    , .

    !important . style.css ( 2.4) : p { color: red !important }

    "2" , . "1" - , color , .

    2.3. CSS CSS . :

    (px); (mm); (cm); (in) 1 in = 2.54 cm; (pt) 1 pt = 1/72 in; (pc) 1 pc = 12 pt. :

    (%); (em); "" (ex). 0 . :

    blue, green . .: p { color: red }

    #[R][G][B], R , G - B . -

    0 F:

    p { color: #F00 }

    PetruComentariu pt. textUnitile de msurare n CSS

  • 2

    88

    #[RR][GG][BB], RR , GG BB .

    00 FF:

    p { color: #FF0000 }

    rgb([R], [G], [B]), R, G B -, ,

    0 255:

    p { color: rgb(255, 0, 0) }

    rgb([R%], [G%], [B%]), R%, G% B% , , :

    p { color: rgb(100%, 0%, 0%) }

    .

    2.4. , -

    , "". ,

    .

    .

    2.4.1. font-family :

    p { font-family: "Arial" }

    . -

    .

    :

    p { font-family: "Verdana", "Tahoma" }

    serif, sans-serif, cursive, fantasy monospace:

    p { font-family: "Verdana", "Tahoma", sans-serif }

    PetruComentariu pt. textNumele fontului

  • CSS. Web-

    89

    2.4.2. font-style .

    :

    normal : p { font-family: "Arial"; font-style: normal }

    italic : p { font-family: "Arial"; font-style: italic }

    oblique : p { font-family: "Arial"; font-style: oblique }

    2.4.3. font-size :

    .text1 { font-size: 12pt; font-family: "Arial" }

    xx-small, x-small, small, medium, large, x-large xx-large:

    .text1 { font-size: large; font-family: "Arial" }

    , (, ) larger smaller: .text1 { font-size: 150%; font-family: "Arial" } .text2 { font-size: smaller; font-family: "Arial" }

    2.4.4. color :

    .text1 { font-size: 12pt; font-family: "Arial"; color: red }

    .text2 { font-size: 12pt; font-family: "Arial"; color: #00FF00 }

    .text3 { font-size: 12pt; font-family: "Arial"; color: rgb(255, 0, 0) }

    PetruNot autoadezivStilul fontului

    PetruNot autoadezivMrimea fontului

    PetruNot autoadezivCuloiarea fontului

  • 2

    90

    2.4.5. font-weight . - :

    100, 200, 300, 400, 500, 600, 700, 800, 900 100 , 900 : p { font-family: "Arial"; font-style: italic; font-weight: 700 }

    normal . 400: p { font-family: "Arial"; font-style: italic; font-weight: normal }

    bold . 700: p { font-family: "Arial"; font-style: italic; font-weight: bold }

    2.5. , , -, , , - .

    2.5.1. letter-spacing . - :

    normal : p { letter-spacing: normal; font-style: italic; font-weight: normal }

    CSS : p { font-size: 12pt; color: red; letter-spacing: 5mm }

    2.5.2. word-spacing . - :

    normal : p { word-spacing: normal; font-style: italic; font-weight: normal }

    PetruNot autoadezivFormatarea textului

  • CSS. Web-

    91

    CSS : p { font-size: 12pt; color: red; word-spacing: 5mm }

    2.5.3. text-indent " ". :

    p { text-indent: 10mm; font-style: italic; font-weight: normal }

    2.5.4. line-height - . :

    normal : p { line-height: normal; font-style: italic; font-weight: normal }

    CSS -:

    p { font-size: 12pt; color: red; font-family: "Arial"; line-height: 5mm }

    2.5.5. text-align . - :

    center :

    left :

    right :

    PetruNot autoadezivAranjarea pe orizontal a textului

  • 2

    92

    justify ( ):

    2.5.6. vertical-align - -, , .

    :

    baseline : td { font-size: 12pt; color: red; vertical-align: baseline }

    middle : td { font-size: 12pt; color: red; vertical-align: middle }

    top : td { font-size: 12pt; color: red; vertical-align: top }

    bottom : td { font-size: 12pt; color: red; vertical-align: bottom }

    2.5.7. , text-decoration , - . :

    none ( ):

    underline :

    overline :

    line-through :

    blink :

    PetruNot autoadezivAranjarea vertical a texului

    PetruNot autoadeziv

  • CSS. Web-

    93

    Web- Internet Explorer blink.

    2.5.8. text-transform . :

    capitalize ; uppercase ; lowercase ; none . :

    2 3

    :

    2

    3

    2.5.9. white-space . Web- . :

    normal : 1

    2

    Web-: 1 2

    PetruNot autoadezivTransformarea textului

    PetruNot autoadezivSpaiu ntre cuvinte

  • 2

    94

    pre : 1

    2

    Web-: 1

    2

    nowrap HTML- . , :

    1

    2

    3

    Web-: 1 2

    3

    2.6. Web- Web- . ,

    .

    .

    -

    Web-, , Web-.

    2.6.1. margin-left, margin-right, margin-top margin-bottom Web- . . ,

    .

    PetruNot autoadezivMargini exterioare

  • CSS. Web-

    95

    :

    margin-left : body { margin-left: 0 }

    margin-right : body { margin-right: 5% }

    margin-top : body { margin-top: 15mm }

    margin-bottom : body { margin-bottom: 20px }

    :

    :

    body { margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0 }

    margin :

    margin:

    :

    body { margin: 15mm 5% 20px 0 }

    :

    body { margin: 0 }

    2.6.2. padding-left, padding-right, padding-top padding-bottom Web- ( ). , .

    :

    padding-left : td { padding-left: 0 }

    padding-right : td { padding-right: 50px }

    PetruNot autoadezivSpaiu interior

  • 2

    96

    padding-top : td { padding-top: 15mm }

    padding-bottom : td { padding-bottom: 20px }

    padding :

    padding:

    :

    td { padding: 15mm 50px 20px 0 }

    :

    td { padding: 5px }

    2.7. , Web- Web- . -

    . ,

    , Web-, , .

    2.7.1. border-left-style ( ), border-right-style ( ), border-top-style ( ) border-bottom-style ( ) . - :

    none ; solid ; dotted ; dashed ; double ; groove ; ridge ;

    PetruNot autoadezivStilul ramei

  • CSS. Web-

    97

    inset , ; outset ,

    .

    Web- ( 2.6).

    2.6.

    table { border-left-style: dashed; border-right-style: dotted; border-top-style: solid; border-bottom-style: groove } td { border-left-style: none; border-right-style: none; border-top-style: none; border-bottom-style: none; text-align: center } caption { border-top-style: solid } p { border-left-style: dotted; border-right-style: dotted; border-top-style: dotted; border-bottom-style: dotted }

    1 2

    3 4

  • 2

    98

    ,

    , , .

    border-style:

    border-style:

    , .

    2.7.2. border-left-width ( ), border-right-width ( ), border-top-width ( ) border-bottom-width ( ) . - :

    table { border-left-width: 5px; border-right-width: 5px; border-top-width: 0; border-bottom-width: 10px }

    :

    thin ; medium ; thick . table { border-left-width: medium; border-right-width: medium; border-top-width: thin; border-bottom-width: thick }

    border-width: border-width:

    , .

    2.7.3. border-left-color ( ), border-right-color ( ), border-top-color ( ) border-bottom-color ( ) : table { border-left-color: red; border-right-color: #000080; border-top-color: green; border-bottom-color: black }

  • CSS. Web-

    99

    border-style border-width, - border-color.

    2.7.4. , -

    border:

    border:

    , -

    , :

    td { border: red thin solid }

    2.8.

    .

    , -

    Web-. , , - , . -

    ,

    , , , 12 , ,

    ,

    .

    2.8.1. background-color :

    body { background-color: green } td { background-color: silver }

    transparent.

    , :

    td { background-color: transparent }

    PetruNot autoadezivFonul elementulu

  • 2

    100

    2.8.2. background-image URL- -, .

    URL- ( - , ): body { background-image: url(foto1.gif) }

    none. ,

    :

    body { background-image: none }

    2.8.3. background-repeat . :

    repeat , ( ): body { background-image: url(foto1.gif); background-repeat: repeat }

    repeat-x : body { background-image: url(foto1.gif); background-repeat: repeat-x }

    repeat-y : body { background-image: url(foto1.gif); background-repeat: repeat-y }

    no-repeat : body { background-image: url(foto1.gif); background-repeat: no-repeat }

    2.8.4. background-attachment , . -

    :

    scroll - ( ): body { background-image: url(foto1.gif); background-repeat: no-repeat; background-attachment: scroll }

    PetruNot autoadezivRepetarea imaginii de fundal

    PetruNot autoadezivScroll pentru imaginea de fundal

  • CSS. Web-

    101

    fixed : body { background-image: url(foto1.gif); background-repeat: no-repeat; background-attachment: fixed }

    2.8.5. background-position -. -

    . :

    body { background-image: url(foto1.gif); background-repeat: no-repeat; background-attachment: fixed; background-position: 50% 50% }

    , :

    left ; right ; center ; top ; bottom . :

    body { background-image: url(foto1.gif); background-repeat: no-repeat; background-attachment: fixed; background-position: left center }

    2.8.6. background background-color, background-image, back-ground-position, background-repeat background-attachment. : body { background: green url(foto1.gif) no-repeat fixed left center } body { background: green }

    , -

    . , -

    . , ,

    , -

    .

    PetruNot autoadezivPoziia imaginii de fundal

  • 2

    102

    2.9. ,

    . , -

    .

    2.9.1. list-style-type . :

    disc : ul { list-style-type: disc }

    circle : ul { list-style-type: circle }

    square : ul { list-style-type: square }

    decimal : ol { list-style-type: decimal }

    lower-roman : ol { list-style-type: lower-roman }

    upper-roman : ol { list-style-type: upper-roman }

    lower-alpha : ol { list-style-type: lower-alpha }

    upper-alpha : ol { list-style-type: upper-alpha }

    none : ol { list-style-type: none }

    2.9.2. list-style-image URL- , .

    PetruNot autoadezivListe, CSS

    PetruNot autoadezivImagine n calitate de marcator al listei

  • CSS. Web-

    103

    , HTML-: ol { list-style-image: url(foto1.gif) }

    2.9.3. list-style-position - . :

    outside . : ol { list-style-position: outside }

    inside . :

    ol { list-style-position: inside }

    2.10. cursor -

    . :

    auto Web- : p { cursor: auto }

    crosshair : p { cursor: crosshair }

    default ( ): p { cursor: default }

    pointer : p { cursor: pointer }

    move , : p { cursor: move }

    n-resize, ne-resize, nw-resize, s-resize, se-resize, sw-resize, e-resize, w-resize , : p { cursor: n-resize }

    text : p { cursor: text }

    PetruNot autoadezivTipul cursorului

  • 2

    104

    wait : p { cursor: wait }

    progress : p { cursor: progress }

    help : p { cursor: help }

    2.11. . Web- - . -

    :

    a:link ; a:visited ; a:active ; a:hover , .

    ! .

    link, vlink alink :

    a:link { color: #000000 } a:visited { color: #000080 } a:active { color: #FF0000 }

    , ,

    :

    a:link { color: red; text-decoration: underline } a:visited { color: blue; text-decoration: underline } a:active { color: green; text-decoration: none } a:hover { color: li