CHAPTER 8

Tutorial: Working 

8

with Code

As you add text, images, and other content to a web page, Dreamweaver 8 

generates HTML code. This tutorial explains how to use Code view to 

display a document's underlying code, and how to add and edit code 

manually.

If you've already set up your site and completed the previous tutorials, you 

can continue working in the same index.html file.

If you haven't completed the previous tutorials, you can still complete this 

tutorial. First, set up your site by following the instructions in 

 Tutorial: 

Setting Up Your Site and Project Files  on page 49

. Next, use the 

index_code.html file in the cafe_townsend/completed_files/dreamweaver 

folder to complete this tutorial. The index_code.html is a duplicate copy of 

the finished index.html file from 

Chapter 6,  Tutorial: Formatting Your 

Page with CSS,  on page 99

.

NO

If you begin this tutorial with the completed index_code.html file, instead of 

TE

the index.html file from 

Chapter 6,  Tutorial: Formatting Your Page with 

CSS,  on page 99

 certain steps and illustrations in the tutorial will not 

match what you see on your screen.

In this tutorial, you will complete the following tasks:

Look at the code  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 140

Switch to the coding workspace (Windows only). . . . . . . . . . . . . 142

Add a tag with the Tag Chooser . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142

Edit a tag  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145

Look up information about a tag. . . . . . . . . . . . . . . . . . . . . . . . . . . .  147

Add an image with code hints . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 148

Check your changes  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .151

Print your code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152

139