1 / 19

Chapter 3

Chapter 3. Tables, & Page Layout. Objectives. Add a border to a table Format table content Format a table Add borders to images Create head content. Understand page layout Design a Web page using tables Create a table structure Modify a table structure Describe HTML table tags

barr
Download Presentation

Chapter 3

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Chapter 3 Tables, & Page Layout

  2. Objectives • Add a border to a table • Format table content • Format a table • Add borders to images • Create head content • Understand page layout • Design a Web page using tables • Create a table structure • Modify a table structure • Describe HTML table tags • Add content

  3. Understanding Tables & Page Layout • Tables • Used for page layout, such as placing text and graphics on a page at the right location • Also provides a method to add vertical and horizontal structure to a page • Rows • Horizontal collection of cells • Column • Vertical collection of cells • Cell • Container created when the row and column intersect

  4. Understanding Tables & Page Layout (cont.) • Page Layout • The process of arranging the text, images, and other elements on the page

  5. Inserting a Table • Cell padding • The amount of space between the edge of a cell and its contents • Cell spacing • The amount of space between cells • Table Width Options • Percentage • Expands with the width of the window and the monitor size in which it is being displayed • Pixels • Will remain the same size regardless of the window and monitor size

  6. Inserting a Table (cont.) • No Wrap Option • Cell & table will expand to accommodate text that will not fit within the cell

  7. Insert Bar • Appears at the top of the window below the Application Bar • Contains buttons for creating & inserting objects

  8. Chapter 1: Creating a Dreamweaver Web Page and Local Site

  9. Layout Tab • Use to work with tables & table features • Buttons • Standard Mode • Displays a table as a grid of lines • Expanded Tables Mode • Temporarily adds cell padding and spacing • Table • Places a table at the insertion point • Insert Row Above • Inserts a row above the selected row • Insert row Below • Inserts a row below the selected row

  10. Layout Tab (cont.) • Insert Column to the Left • Inserts a column to the left of the selected column • Insert Column to the Right • Inserts a column to the right of the selected column

  11. Table Defaults & Accessibility • Table Dialog Box • Displayed when you insert a table and contains default settings for each of the table attributes • Attributes • Rows • Determines the number of rows in the table • Columns • Determines the number of columns in the table • Table Width • Specifies the width of the table in pixels or as a percentage of the browser window’s width

  12. Table Defaults & Accessibility (cont.) • Border Thickness • Specifies the border width in pixels • Cell Padding • Specifies the number of pixels between a cell’s border and its contents • Cell Spacing • Specifies the number of pixels between adjacent table cells • Header • Specifies whether the top row and/or column is designated as a header cell

  13. Table Defaults & Accessibility (cont.) • Caption • Provides a table heading • Summary • Provides a table description

  14. Property Inspector Table Features • Use to modify & add table attributes • Buttons • Table • Specifies the table ID • Rows & Cols • The number of rows and columns in the table • W • Specifies the minimum width of the table • Cellpad • The number of pixels between the cell border and the cell content

  15. Property Inspector Table Features (cont.) • Cellspace • The number of pixels between adjacent table cells • Align • Determines where the table appears • Border • Specifies the border width in pixels • Clear Column Widths & Clear Row Heights • Deletes all specified row height or column width values from the table • Convert Table Widths to Pixels • Sets the width of each column in the table to it current width expressed as pixels

  16. Property Inspector Table Features (cont.) • Convert Table Widths to Percent • Sets the width of each column in the table to its current width expressed as a percentage

More Related