Chapter FOURObjectivesSlide 3Slide 4Entering the HTML Tags to Define the Web Page StructureCreating a Borderless Table to Position ImagesSlide 7Inserting Images in a TableCreating a Vertical Menu Bar with Text LinksSlide 10Adding Text to a Table CellSlide 12Viewing and Printing a Web PageCopying and Pasting HTML Code to a New FileSlide 15Changing the TitleSlide 17Deleting an ImageSlide 19Creating a Horizontal Menu Bar with Text LinksSlide 21Creating a Table with Borders and Inserting TextSlide 23Creating Additional Cells and Inserting TextSlide 25Saving and Printing an HTML FileViewing and Printing the Web Page Using the BrowserAdding Cellspacing and Cellpadding to a TableSlide 29Adding a Table CaptionSlide 31Saving and Printing the HTML File and Viewing and Printing the Web PageSpanning the Main Heading across All ColumnsSlide 34Creating Headings that Span Rows and ColumnsSlide 36Creating the Second Heading that Spans RowsSlide 38Creating the Second Heading that Spans ColumnsSlide 40Slide 41Creating Tables in a Web SiteDefine table elementsDescribe the steps used to plan, design, and code a tableCreate a borderless table to organize imagesCreate a vertical menu bar with text links2Create a borderless table to organize textCreate a horizontal menu bar with text linksCreate a table with bordersChange the horizontal alignment of text3Add background color to rows and cellsAlter the spacing between and within cells using the cellspacing and cellpadding attributesInsert a caption below a tableUse the rowspan and colspan attributes45If necessary, click line 10Type <table border="0" cols="2“ width="90%"> and then press the ENTER key67If necessary, click line 11, type <tr> as the tag, and then press the ENTER keyType <td><img src=“bellvideologo.gif” width=“430” height=“74” alt=“Bell Video Logo” /></td> and then press the ENTER keyType <td><img src="csexcellence.gif" width="108” height=”94” alt=”Excellence Award” /></td> and then press the ENTER keyType </tr> and then press the ENTER keyType </table> and then press the ENTER key8If necessary, click line 17Enter the HTML code shown belowPress the ENTER key twice910If necessary, click line 27Enter the HTML code as shown in Table 4-5 on page HTM 151 and then press the ENTER key111213Click the Notepad button on the taskbarClick immediately to the left of the < in the <!DOCTYPE html tag on line 1. Drag through the first </table> tag on line 15 to highlight lines 1 through 15Press CTRL+C to copy the selected lines to the ClipboardClick File on the menu bar and then click NewPress CTRL+V to paste the contents from the Clipboard into a new file1415Highlight the words, — Great Service, Great Selection, between the <title> and </ title > tags on line 7. Type - New Releases as the textClick immediately to the right of the </table> tag on line 15. Press the ENTER key three timesType </body> and then press the ENTER keyType </html> as the end tag1617Highlight line 13, which contains the code to insert the image, csexcellence.gifPress the DELETE key twice1819If necessary, click line 16Enter the HTML code as shown in Table 4-6 on page HTM 159Press the ENTER key twice2021If necessary, click line 28Enter the HTML code as shown in Table 4-7 on page HTM 162Press the ENTER key twice2223If necessary, click line 53Enter the HTML code as shown in Table 4-8 on page HTM 1642425With a floppy disk in drive A, click File on the menu bar and then click Save As. Type newreleases.htm in the File name text boxIf necessary, click 3½ Floppy (A:) in the Save in list. Click the Project04 folder and then click the ProjectFiles folder in the list of available folders. Click the Save button in the Save As dialog boxClick File on the menu bar and then click Print on the file menu2627Click immediately to the right of the 5 in border=“5” in line 28 and then press the SPACEBARType cellpadding=“2” cellpadding=“5” as the attributes2829Highlight the text <!--Insert caption here --> on line 69Type <caption align=“bottom”><em>Listing of movies by actor</em></caption> as the tag303132Highlight the <!—Insert Movies by Type colspan here --> text on line 29. Type <tr> and then press the ENTER keyType <th colspan="3" bgcolor="lightsteelblue"> and then press the ENTER keyType <font color="#993366“ face="chaucer“ size="+2">Movies by Type</font> and then press the ENTER keyType </th> and then press the ENTER keyType </tr> as the end table row tag3334Highlight <!--Insert Action rowspan here --> text on line 34Enter the HTML code as shown in Table 4-9 on page HTM 1793536Highlight the <!--Insert Comedy rowspan here --> text on line 66 and then press the DELETE keyType <tr> and then press the ENTER keyType <th rowspan="4" bgcolor="#336699"> and then press the ENTER keyType <font color="#ffffff“ size="+1">Comedy</font> and then press the ENTER keyType </th> as the tag3738Highlight the <!--Insert Title - Actor(s) colspan here --> text on line 70Type <th colspan="2" bgcolor="thistle"> and then press the ENTER keyType <font color="#336699" size="+1">Title - Actor(s)</font> and then press the ENTER keyType </th> and then press the ENTER keyType </tr> and then press the ENTER
View Full Document