Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Microsoft FrontPage 2003 Illustrated Complete Designing Web Pages with Layout Tables Objectives Use the Draw pointer Create an interactive button Understand layout tables Use a layout table to format a new page Designing Web Pages with Layout Tables Unit K 2 Objectives Work in a layout cell Format a layout cell Draw a new layout cell Create a custom link bar Designing Web Pages with Layout Tables Unit K 3 Designing Web Pages with Layout Tables Use tables to create a framework or structure to organize and store the content of Web pages and sites Tables allow you to design pages in tables and rows Almost all browsers display tables consistently Designing Web Pages with Layout Tables Unit K 4 Using the Draw Pointer Three methods for creating a table in a Web page: – Table menu – Insert Table button on the Standard toolbar – Draw Table pointer The Draw Table pointer is a good choice when you are experimenting with how you want your table to look or when you need to draw new cells in an existing table Designing Web Pages with Layout Tables Unit K 5 Using the Draw Pointer (cont.) New column being added to a table Draw Table pointer Designing Web Pages with Layout Tables Unit K 6 Creating a Nested Table A nested table is a table that appears in one cell of another table Useful for controlling the format and appearance of table data Designing Web Pages with Layout Tables Unit K 7 Creating an Interactive Button An Interactive button (also called a hover button) is a button in a Web page that changes appearance when the pointer moves over it Interactive buttons are animated The act of moving the pointer over an interactive button is called mouse over Interactive buttons usually contain hyperlinks Designing Web Pages with Layout Tables Unit K 8 Creating an Interactive Button (cont.) Interactive Buttons dialog box Designing Web Pages with Layout Tables Unit K 9 Understanding Layout Tables A layout table is a framework that organizes the content of an entire page You can use a layout table instead of creating a new Web page and then adding a table to it Each cell in a layout table can contain content such as images, text, and hyperlinks Designing Web Pages with Layout Tables Unit K 10 Understanding Layout Tables (cont.) You can create a layout table by using a table layout template or by drawing your own layout table After creating a layout table, you can change its properties just like you can with regular tables A layout table’s framework is divided into regions called layout cells Designing Web Pages with Layout Tables Unit K 11 Understanding Layout Tables (cont.) Changing a column or row to autostretch means that the browser will automatically resize the layout cell to fill the available space in the browser window A spacer image is a picture that serves as an empty placeholder to add space between layout cells in the table Designing Web Pages with Layout Tables Unit K 12 Understanding Layout Tables (cont.) When you select a layout cell’s border, sizing handles appear around the layout cell Unlike working in regular tables, resizing a layout cell in a layout table does not automatically resize the other layout cells in the layout table Designing Web Pages with Layout Tables Unit K 13 Understanding Layout Tables (cont.) Layout table created from a template Designing Web Pages with Layout Tables Unit K 14 Understanding Layout Tables (cont.) You can use the Layout Tables and Cells task pane to modify a layout table Designing Web Pages with Layout Tables Unit K 15 Understanding Layout Tables (cont.) You can use the Cell Formatting task pane to modify cells Designing Web Pages with Layout Tables Unit K 16 Using a Layout Table to Format a New Page If you want to use a layout table to format the page’s contents, you need to display the Layout Tables and Cells task pane To use a layout table to design an entire Web page, the page cannot include any shared borders Designing Web Pages with Layout Tables Unit K 17 Using a Layout Table to Format a New Page (cont.) Layout table added to Web page Designing Web Pages with Layout Tables Unit K 18 Working in a Layout Cell There are multiple ways to create a new layout cell: – Use the Draw Layout Cell button on the Layout Tables and Cells task pane and use the pointer to draw a new cell – Click the Insert Layout Cell link on the Layout Tables and Cells task pane – Use the Tables toolbar buttons to split an existing layout cell or insert rows and columns Designing Web Pages with Layout Tables Unit K 19 Formatting a Layout Cell After adding content to layout cells, you can use the Cell Formatting task pane to change the borders, colors, and spacing of layout cells In most cases, any formatting that you can apply to a cell in a regular table is allowed in a layout cell Designing Web Pages with Layout Tables Unit K 20 Formatting a Layout Cell (cont.) Borders added to layout cells border Designing Web Pages with Layout Tables Unit K 21 Drawing a New Layout Cell There’s one significant difference between working in a regular table and working in a layout table: When you insert a layout cell in a layout table, the size and dimensions of existing layout cells in the the layout table do not change to accommodate it If you want to insert a new layout cell, you must make room for it Designing Web Pages with Layout Tables Unit K 22 Creating a Custom Link Bar You can create a custom link bar when you want to include links to only selected pages in a Web site You can create one or more custom link bars in a Web site as necessary, and multiple pages can use the same custom link bar Designing Web Pages with Layout Tables Unit K 23 Creating a Custom Link Bar (cont.) Creating a custom link bar navigation structure Designing Web Pages with Layout Tables Unit K 24 Creating a Custom Link Bar (cont.) Link Bar Properties dialog box Designing Web Pages with Layout Tables Unit K 25 Summary Using the Draw pointer Creating an interactive button Understanding layout tables Using a layout table to format a new page Designing Web Pages with Layout Tables Unit K 26 Summary Working in a layout cell Formatting a layout cell Drawing a new layout cell Creating a custom link bar Designing Web Pages with Layout Tables Unit K 27