HTML & (X)HTML & CSS Tutorials.pdf

(22992 KB) Pobierz
Microsoft Word - HTML for the World Wide Web with XHTML and CSS-Visual Quic…
I NTRODUCTION ..............................................................................................................................7
The Internet, the Web, and HTML .........................................................................................8
Open but Not Equal ................................................................................................................8
The Browser Wars ..................................................................................................................9
The Push for Standards .........................................................................................................9
The Real World .....................................................................................................................10
What Should You Use? ........................................................................................................11
How This Book Works ..........................................................................................................11
The HTML VQS Web Site ....................................................................................................12
C HAPTER 1. W EB P AGE B UILDING B LOCKS .................................................................................13
Markup: Elements, Attributes, and Values ..........................................................................13
A Web Page's Text Content .................................................................................................17
Links, Images, and Other Non-Text Content ......................................................................19
File Names ............................................................................................................................20
URLs ......................................................................................................................................21
HTML vs XHTML ..................................................................................................................26
Versions, flavors, and DOCTYPE .......................................................................................28
The Default Display of (X)HTML ..........................................................................................31
Adding Style to Your Web Pages ........................................................................................33
The Cascade: When Rules Collide .....................................................................................34
A Property's Value ................................................................................................................37
C HAPTER 2. W ORKING W ITH W EB P AGE F ILES ...........................................................................41
Designing Your Site ..............................................................................................................41
Creating a New Web Page ..................................................................................................43
Saving Your Web Page ........................................................................................................44
About Microsoft Word and Web Pages ...............................................................................47
Specifying a Default or "Home" Page .................................................................................49
Editing Web Pages ...............................................................................................................50
Organizing Files ....................................................................................................................52
Viewing Your Page in a Browser .........................................................................................53
The Inspiration of Others ......................................................................................................55
C HAPTER 3. B ASIC (X)HTML S TRUCTURE ..................................................................................59
Starting Your Web Page ......................................................................................................59
Creating the Foundation .......................................................................................................60
Declaring the Encoding ........................................................................................................61
Creating a Title ......................................................................................................................63
C reating Section Headers ....................................................................................................65
Starting a New Paragraph ....................................................................................................66
Naming Elements .................................................................................................................67
Breaking up a Page into Divisions .......................................................................................68
Creating Inline Spans ...........................................................................................................70
Creating a Line Break ...........................................................................................................71
Adding Comments ................................................................................................................73
Labeling Elements in a Web Page ......................................................................................74
C HAPTER 4. B ASIC (X)HTML F ORMATTING .................................................................................76
Making Text Bold or Italic .....................................................................................................76
Changing the Size of Text ....................................................................................................78
Using a Monospaced Font ...................................................................................................80
Using Preformatted Text ......................................................................................................81
Quoting Text .........................................................................................................................83
Creating Superscripts and Subscripts .................................................................................86
Marking Changed Text .........................................................................................................88
Explaining Abbreviations ......................................................................................................89
C HAPTER 5. C REATING W EB I MAGES ..........................................................................................92
About Images for the Web ...................................................................................................92
Getting Images .....................................................................................................................98
The Save for Web Command ..............................................................................................99
Page 1 of 654
T ABLE OF C ONTENT
S PECIAL THANKS TO : .....................................................................................................................7
Making Images Smaller ......................................................................................................102
Creating Transparency .......................................................................................................103
Saving Images with Transparency ....................................................................................105
Simulating Transparency ...................................................................................................107
Using (Mostly) Browser Safe Colors .................................................................................109
Reducing the Number of Colors ........................................................................................113
Showing Images Progressively .........................................................................................114
Blurring Images to Aid JPEG Compression ......................................................................115
Creating Animated GIFs .....................................................................................................117
C HAPTER 6. U SING I MAGES .......................................................................................................120
Inserting Images on a Page ...............................................................................................120
Offering Alternate Text .......................................................................................................122
Specifying Size for Speedier Viewing ...............................................................................124
Scaling an Image ................................................................................................................127
Linking Thumbnails to Images ...........................................................................................130
Making Images Float ..........................................................................................................132
Stopping Elements from Wrapping ....................................................................................135
Adding Space around an Image ........................................................................................137
Aligning Images ..................................................................................................................139
Adding Horizontal Rules .....................................................................................................140
C HAPTER 7. L INKS .....................................................................................................................143
Creating a Link to Another Web Page ..............................................................................144
Creating Anchors ................................................................................................................147
Linking to a Specific Anchor ..............................................................................................149
Targeting Links to Specific Windows ................................................................................150
Setting the Default Target ..................................................................................................152
Creating Other Kinds of Links ............................................................................................154
Creating Keyboard Shortcuts for Links .............................................................................157
Setting the Tab Order for Links .........................................................................................159
Using Images to Label Links ..............................................................................................160
Dividing an Image into Clickable Regions ........................................................................162
Creating a Client-Side Image Map ....................................................................................164
Using a Server-Side Image Map .......................................................................................167
C HAPTER 8. C REATING S TYLES .................................................................................................169
Constructing a Style Rule ..................................................................................................169
Constructing Selectors .......................................................................................................170
Selecting Elements by Name .............................................................................................172
Selecting Elements by Class or ID ....................................................................................173
Selecting Elements by Context ..........................................................................................175
Selecting Link Elements Based on Their State ................................................................180
Selecting Part of an Element .............................................................................................182
Selecting Elements Based on Attributes ...........................................................................185
Specifying Groups of Elements .........................................................................................187
Combining Selectors ..........................................................................................................189
C HAPTER 9. A PPLYING S TYLES .................................................................................................190
Creating an External Style Sheet ......................................................................................190
Linking External Style Sheets ............................................................................................192
Offering Alternate Style Sheets .........................................................................................193
Creating an Internal Style Sheet .......................................................................................195
Importing External Style Sheets ........................................................................................196
Applying Styles Locally ......................................................................................................198
The Importance of Location ...............................................................................................199
Adding Comments to Style Rules ......................................................................................201
C HAPTER 10. F ORMATTING W ITH S TYLES .................................................................................202
Choosing a Font Family .....................................................................................................203
Embedding Fonts on a Page .............................................................................................204
Creating Italics ....................................................................................................................206
Applying Bold Formatting ...................................................................................................207
Setting the Font Size ..........................................................................................................208
Setting the Line Height .......................................................................................................213
Page 2 of 654
Setting All Font Values at Once .........................................................................................215
Setting the Text Color .........................................................................................................217
Changing the Text's Background ......................................................................................218
Controlling Spacing ............................................................................................................220
Adding Indents ....................................................................................................................223
Setting White Space Properties .........................................................................................225
Aligning Text .......................................................................................................................227
Changing the Text Case ....................................................................................................228
Using Small Caps ...............................................................................................................230
Decorating Text ..................................................................................................................232
C HAPTER 11. L AYOUT WITH S TYLES ..........................................................................................235
Structuring Your Pages ......................................................................................................236
The Box Model ....................................................................................................................237
Displaying and Hiding Elements ........................................................................................239
Positioning Elements Absolutely .......................................................................................240
Affixing an Element to the Browser Window .....................................................................242
Offsetting Elements In the Natural Flow ...........................................................................244
Changing the Background .................................................................................................245
Changing the Foreground Color ........................................................................................249
Changing the Cursor ..........................................................................................................251
Setting the Border ...............................................................................................................252
Adding Padding around an Element .................................................................................256
Setting the Margins around an Element ...........................................................................258
Setting the Height or Width for an Element ......................................................................259
Positioning Elements in 3D ................................................................................................263
Determining Where Overflow Should Go ..........................................................................264
Making Elements Float .......................................................................................................266
Controlling Where Elements Float .....................................................................................268
Aligning Elements Vertically ..............................................................................................269
C HAPTER 12. S TYLE S HEETS FOR P RINTING .............................................................................272
Using Media-Specific Style Sheets ...................................................................................272
How Print Style Sheets Differ .........................................................................................273
Controlling Page Breaks .................................................................................................275
Other Print Specific CSS Properties .................................................................................277
C HAPTER 13. L ISTS ...................................................................................................................280
Page 3 of 654
Creating Ordered and Unordered Lists .............................................................................280
Choosing Your Markers (Bullets) ..................................................................................283
Choosing Where to Start List Numbering ....................................................................284
Using Custom Markers ....................................................................................................286
Controlling Where Markers Hang ......................................................................................288
Setting All List-Style Properties at Once ...........................................................................289
Creating Definition Lists .....................................................................................................291
Styling Nested Lists .........................................................................................................293
C HAPTER 14. T ABLES ................................................................................................................296
Mapping Out Your Page .....................................................................................................297
Creating a Simple Table .....................................................................................................298
Adding a Border ..................................................................................................................301
Setting the Width ................................................................................................................304
Centering a Table on the Page .......................................................................................308
Wrapping Text around a Table ..........................................................................................309
Combining Tables ...............................................................................................................311
Aligning a Cell's Contents ..................................................................................................314
Changing the Background .................................................................................................317
Controlling the Space .........................................................................................................321
Spanning a Cell across Columns ..................................................................................326
Spanning a Cell across Rows ........................................................................................328
Dividing Your Table into Column Groups .........................................................................329
Dividing the Table into Horizontal Sections ................................................................333
Choosing Which Borders to Display ..................................................................................335
Controlling Line Breaks in a Cell ...................................................................................338
Speeding up Table Display ................................................................................................339
C HAPTER 15. F RAMES ..............................................................................................................340
Creating a Simple Frameset ..............................................................................................340
Creating Frames in Columns .............................................................................................345
Creating Frames in Rows and Columns ...........................................................................347
Combining Framesets ........................................................................................................349
Creating an Inline Frame ....................................................................................................351
Adjusting a Frame's Margins .............................................................................................353
Showing or Hiding Scroll Bars .......................................................................................355
Adjusting the Color of the Borders ...............................................................................357
Adjusting the Frame Borders .........................................................................................360
Keeping Visitors from Resizing Frames .......................................................................364
Targeting Links to Particular Frames ................................................................................366
Targeting Links to Special Spots .......................................................................................369
Changing the Default Target ..........................................................................................371
Nesting Framesets .............................................................................................................372
Offering Alternatives to Frames .........................................................................................373
Embedding Content with Objects ......................................................................................377
Making Frames More Accessible ......................................................................................379
C HAPTER 16. F ORMS ................................................................................................................380
About CGI Scripts ...............................................................................................................380
Getting a Script ...................................................................................................................383
Using the Scripts Included with This Book ........................................................................385
Preparing a Script ...............................................................................................................386
Creating a Form ................................................................................................................386
Sending Form Data via E-mail ...........................................................................................388
Using a Form Hosting Service ...........................................................................................390
Creating Text Boxes .........................................................................................................393
Creating Password Boxes ..............................................................................................395
Creating Radio Buttons ...................................................................................................397
Creating Checkboxes ......................................................................................................399
Creating Menus .................................................................................................................401
Creating Larger Text Areas .............................................................................................405
Allowing Visitors to Upload Files .......................................................................................407
About Hidden Fields ...........................................................................................................408
Adding Hidden Fields to a Form ....................................................................................409
Creating the Submit Button ................................................................................................409
Resetting the Form .............................................................................................................413
Using an Image to Submit Data .........................................................................................416
Organizing the Form Elements ......................................................................................418
Formally Labeling Form Parts ........................................................................................420
Setting the Tab Order in a Form ....................................................................................421
Adding Keyboard Shortcuts ...............................................................................................423
Disabling Form Elements ...................................................................................................424
Keeping Elements from Being Changed ...........................................................................426
C HAPTER 17. M ULTIMEDIA ........................................................................................................429
Of Plugins and Players .......................................................................................................429
Getting Players for Your Visitors .......................................................................................433
Getting Multimedia Files .....................................................................................................435
Embedding QuickTime Movies ..........................................................................................435
Scaling a QuickTime Movie ...............................................................................................440
Looping a QuickTime Movie ..............................................................................................442
Putting QuickTime Sounds on a Page ..............................................................................443
Hiding QuickTime Sounds .................................................................................................444
Embedding Windows Media Player Files .....................................................................445
Inserting Java Applets ........................................................................................................450
Embedding Other Multimedia Files ...................................................................................452
Linking to Multimedia Files .................................................................................................454
Creating an Automatic Slide Show ....................................................................................455
Creating a Marquee ..........................................................................................................457
Page 4 of 654
Adding an "Automatic" Script ........................................................................................458
Calling an External Automatic Script .................................................................................460
Triggering a Script ..............................................................................................................461
Creating a Button that Executes a Script ..........................................................................463
Adding Alternate Information .............................................................................................465
Hiding Scripts from Older Browsers ..................................................................................467
Hiding Scripts from XML Parsers ......................................................................................469
Setting the Default Scripting Language .......................................................................470
C HAPTER 19. J AVASCRIPT E SSENTIALS .....................................................................................471
Adding the Current Date and Time ...................................................................................471
Changing a Link's Status Label .........................................................................................473
Changing Multiple Frames with One Link .........................................................................475
Keeping Frames in Their Framesets .................................................................................477
Changing an Image When a Visitor Points .......................................................................479
Loading Images into Cache ...............................................................................................481
Controlling a New Window's Size ......................................................................................484
C HAPTER 20. S YMBOLS AND N ON -E NGLISH C HARACTERS ........................................................484
About Character Encodings ...............................................................................................485
Saving Your Page with the Proper Encoding ...................................................................488
Editing a Page with the Proper Encoding ....................................................................490
Declaring Your Page's Character Encoding .....................................................................493
Adding Characters from Outside the Encoding ................................................................496
Specifying Your Page's Language ....................................................................................499
C HAPTER 21. F ORMATTING : T HE O LD W AY ...............................................................................500
Choosing Default Characteristics for Text ........................................................................500
Formatting Bits of Text .......................................................................................................505
Another Way to Choose Default Colors ............................................................................509
Changing the Color of Links ..............................................................................................510
Striking Out or Underlining Text ........................................................................................512
Making Text Blink .............................................................................................................514
C HAPTER 22. L AYOUT : T HE O LD W AY .......................................................................................514
Using Background Color ....................................................................................................515
Using Background Images .................................................................................................516
Centering Elements on a Page ..........................................................................................518
Specifying the Margins .......................................................................................................519
Keeping Lines Together .....................................................................................................521
Creating Discretionary Line Breaks ...................................................................................522
Specifying the Space Between Paragraphs .................................................................524
Creating Indents .................................................................................................................526
Creating Indents (with Lists) ..............................................................................................527
Creating Blocks of Space ...................................................................................................529
Using Pixel Shims ...............................................................................................................531
Creating Columns ...............................................................................................................533
Positioning Elements with Layers ......................................................................................535
C HAPTER 23. WML: W EB P AGES FOR M OBILE D EVICES ..........................................................538
Preparing Your Server .....................................................................................................539
Starting Your WML Page ...................................................................................................540
Creating a Card .................................................................................................................541
Creating Basic Content ......................................................................................................543
Including an Image .............................................................................................................544
Creating a Table ................................................................................................................546
Creating a Link ..................................................................................................................548
Programming Buttons .....................................................................................................551
Creating Conditional Actions .............................................................................................553
Scheduling an Action ......................................................................................................555
Making a Call ......................................................................................................................556
Setting and Using Variables ..............................................................................................558
Creating Input Boxes .......................................................................................................559
Page 5 of 654
Adding Background Sound ............................................................................................458
C HAPTER 18. S CRIPTS ..............................................................................................................458
Zgłoś jeśli naruszono regulamin