Dreamweaver Tables Tutorial
Dreamweaver tables are a powerful tool for laying out data, text, and graphics on a Web page. A table consists of one or more rows which are horizontal and columns which are vertical. The intersection of a row and a column is called a table cell.
Dreamweaver enables you to manipulate columns and rows as well as individual cells. Some designers use tables to lay out a web page. Dreamweaver provides two ways to view tables: Standard mode in which tables are presented as a grid of rows and columns, and Layout mode which allows you to draw, resize and move boxed on the page while still using using tables for the underlying structure.
Here is a Dreamweaver table viewed in Layout View.
Here's the same Dreamweaver table viewed in Standard View.
To change the view between Layout and Standard view, select View, Table Mode, and choose Layout or Standard Mode from the menu.
NOTE: Expanded Dreamweaver Tables Mode temporarily adds cell padding and spacing to all tables in a document to make them easier to edit.
See the sample table below.
Dreamweaver tables display the table width and column width for each column in the table when it is selected or when the insertion point is in the table. The green arrows are for the table header menu and column header menus. You can click on the arrows to access some common table related commands.
If you do not see a width for the table or for a column, then that table or column does not have a specified width in the HTML code. If two numbers appear, then the visual width as it appears in Design view doesn't’t match the width specified in the HTML code. This can happen when you resize a table by dragging its lower-right corner or when you add content to a cell that’s larger than its set width.
For example, if you set a column’s width to 200 pixels, then add content that stretches the width to 250 pixels, two numbers appear for that column: 200 (the width specified in the code) and (250) in parentheses (the visual width of the column as it’s rendered on your screen).
Dreamweaver Tutorial: Table Formatting Precedence
When formatting Dreamweaver tables in Design view, you can set the properties for the entire table or for selected rows and columns, or cells in the table. You set properties such as background colors for the table, rows, or individual cells. An individual cell property takes precedence over that of the row or table. So if the background color for the table was black, but the background color for a row was blue, the blue row would show in the black table. If a cell in the blue row was set to white, it would show as a white cell in the blue row in the black table.
The order of precedence for table formatting is:
|Table is the lowest level of precedence
|Row is the middle level of precedence
||A cell is the highest level of precedence
Dreamweaver Tutorial: Splitting and Merging Cells
Cells can be merged together to provide a larger single cell. A cell can also be split into two or more cells. The table below was originally two columns and three rows. The two cells in the upper right corner were merged to form one larger cell. The cell on the bottom row of the right column was split into three cells.
You can split a cell into any number of rows or columns. Dreamweaver automatically adds the necessary code in the <table> tag to tell the browser how to render the table.
You can merge any number of cells that are adjacent to each other as long as the entire selection is a line or a rectangle of cells to produce a single cell that spans several rows or columns.
||These two cells were merged into one. The cell below was split into three cells.
View a related Dreamweaver Tutorial:
Dreamweaver 8 Tutorials
All Other Guides and Tutorials
- Guides and Tutorials Blog
- Listing of the latest tutorials published on the GuidesandTutorials website.
- GuidesandTutorials: Audacity Tutorial - Record and Edit Audio
- This Audacity tutorial will show you how to use the basic tools and procedures in the open source audio editing program, Audacity. Not just screen shots, but free narrated multimedia tutorials - You'll learn to use Audacity for recording and editing audio files that can be used for podcasting, mixing music and vocals, creating sound tracks, and other audio projects.
- Audacity Tips & Tricks
- Audacity tips and tricks submitted by users
- Digital Photography Guide
- This Digital Photography Guide will provide you with the basic information you need to take professional quality photogrphs with your digital camera.
- GuidesandTutorials: Dreamweaver Tutorial
- Dreamweaver Tutorial - this series of free Dreamweaver tutorials is just what you need to get up and running with Dreamweaver to create interesting and compelling web sites
- GuidesandTutorials: Microsoft Excel 2003 Tutorial
- This Excel 2003 Tutorial will introduce you to the basics of using the Excel 2003 spreadsheet program. You'll learn to create a spreadsheet, basic Excel workbook skills, work with cells, enter and manipulate data, apply formulas, format data, create and work with charts, and manage Excel workbooks.
- Podcasting Tutorial
- This Podcasting tutorial includes a step by step guide that will show you how to record, publish and promote your podcast. Using inexpensive equipment and free software, you'll be publishing podcasts in no time.
- PowerPoint Tutorial - Microsoft PowerPoint 2003
- This PowerPoint tutorial is just what you need to learn how to use PowerPoint 2003 to create effective and engaging presentations.
- The PowerPoint 2007 Window
- This PowerPoint 2007 tutorial will show you the features and how to get around the PowerPoint Window.
- GuidesandTutorials: Free PowerPoint Templates
- Free PowerPoint templates that you can download and use today. This is a growing library of free resources for PowerPoint users.
- LCD Projector Guide and Tutorial
- This LCD Projector Guide will assist you in the use and purchase of a digital LCD projector or DLP projector. It will discuss the differences between LCD and DLP projectors, size and portability considerations, lamp types and brightness, resolution, image quality and other considerations in the use and purchase of a digital projector.
- Word Tutorial: Microsoft Word 2003
- This Word tutorial is just what you need to learn how to use Word 2003 to create professional looking documents.
- Word 2007 Workspace
- This Microsoft Word 2007 Workspace tutorial will acquaint you with the new tools and features in the Word 2007 Window. It's changed significantly from previus versions and even experienced users will find this helpful.
- Work at Home Jobs
- This Work at Home Jobs tutorial will provide information on ways that you can put your skills and knowledge to use in creating part or full time income while working from home.
- Guides and Tutorials: Free Guides and Tutoials Site Map
- Free guides and tutorials on podcasting, digital video and audio, Audacity, RSS, multimedia development, educational technology, technology integration, K12 Technology, PowerPoint.
- Suggest a New Technology Tutorial
- Free Technology Tutorials on software and technology applications including PowerPoint tutorials, Podcasting tutorials, Dreamweaver tutorials, Audacity, Non-Linear PowerPoint, Digital Photography, RSS tutorial, and everything educational technology.
- Adobe Acrobat 9 Tutorial
- This Adobe Acrobat 9 Tutorial will show you how to create PDFs from MS Office applications, from Multipe files, from web pages and from several other types of documents.
- GuidesandTutorials: Free Tutorials
- Free Tutorials, software, hardware, and technology applications including PowerPoint, Podcasting, Dreamweaver, Audacity,
- Excel 2007 Tutorial | GuidesandTutorials: Free Tutorials
- This free Excel 2007 Tutorial will show you how to use all of the begginer and intermediate features in Excel 2007
This site proudly build with Site Build It!