Dreamweaver Images

Dreamweaver can be used to insert images on webpage. We can also change the width, height of images using dreamweaver. Dreamweaver also provides an easy way to define an alternative tag for image.

How To insert an image

step:
Before Inserting an image make sure you have created a new web page and saved it. Click here to see how to create and save web page using dreamweaver. Also move keep your image and webpage in the same folder before inserting.

step:
Click on insert menu and select image. This will open image source dialogue box.

step:
From Image source dialogue box select your image and click ok. When you insert an image into a Dreamweaver document, a reference to the image file is generated in the HTML source code. To ensure that this reference is correct, the image file must be in the current site. If it is not in the current site, Dreamweaver asks whether you want to copy the file into the site.

How To Change an Image Size

step:
Click on the image that you inserted in dreamweaver. This step is important, because when you click on image the properties for this image will be displayed in properties inspector.

step:
From properties inspector change the value of H (height) and W (width)

How To Make a Hyperlink image

step:
Click on the image that you inserted in dreamweaver.

step:
Using properties inspector type a link, for example http://www.cramerz.com.

step:
When this image is previwed using a browser, you will notice that the image is a hyperlink to the link provided in last step

How To draw a border around an image

step:
Click on the image that you inserted in dreamweaver.

step:
Using properties inspector specify a value for border. Value can be any number like 1 or 2. This border will be calculated in pixels.

Add Alternative for image

Alternative text replaces images in browsers that are configured to omit images; it is also read aloud by software for the visually impaired. Even in browsers that display images, however, alternative text can be useful. For example, in an image-based menu, alternative text appears while the images download.

step:
Click on the image that you inserted in dreamweaver.

step:
Using properties inspector specify a text value in Alt box