Image Resize in Dreamweaver
● Add a Resize Class to your images to make them responsive.
✓ max-height✓ min-height
Step #1: Open your Project in Dreamweaver ~
✓ Open your page in Dreamweaver – or any page with a picture:
✓ … look between the <head></head> tags in Split view …
✓ … and clear some space to work in.
Step #2: CSS Style ~
✓ Copy the following code and paste it between the <head> </head> tags …
<style type="text/css"> </style>
✓ … like this.
✓ You may already have this code - if so - you don't need to repeat it.
✓ You can add your new code inside the existing CSS codes.
Step #3: Add the code ~
✓ Add the following code between the<style type="text/css"> </style> tags:
Step #3: Max-Height ~
✓ Set your max-height:
Step #4: Max-Width ~
✓ Set your max-width:
Step #5: Add the Class to the Images ~
✓ Find and select the image you want to apply the new class too.
Step #6: In-Line CSS ~
✓ Find the code for the images in Split view …
✓ … and add the class to the image:
Step #7: So What?
✓ Now your images will shrink to fit the window!
✓ Put this code on all your pages!
Last Step: Save and Upload your site ~
✓ Upload your site with the work you completed, attach the link to your site where the work is located …
✓… and continue working …