Summary:

img Borders in Dreamweaver

    ● Apply a border style for all the images on your site.


Learn About:

css stylesborder-radius border styles

  •   This tutorial is part of the Art Genre and Home Sweet Home Portfolio Projects.

  •   It is part of a series: 42_float_Dw.htm, 174_img_padding_Dw.htm, 66_img_border_Dw.htm, and 180_img_resize_Dw.htm

Step #1: Open your Project in Dreamweaver ~

Open your current project in Dreamweaver

… and then Double-Click your style sheet to open it:


Step #2: Scroll Down ~

Scroll down to the bottom of your CSS code and click there:


Step #3: Add the Code ~

Copy this code …

img {

}

… and paste it at the bottom:


Step #4: Border Code ~

Start typing as follows:

Choose a border thickness:

Lastly, add a semi-colon ; at the end on the line:


Step #5: Border Style ~

Choose a border style:

Remember: you can change it later:

 

 

Don't forget the semi-colon ; at the end on the line!

 

Step #6: Color ~

Choose a color:


Step #7: Border Radius ~

Add border-radius by copying this code …

border-radius:  20px; 
-webkit-border-radius:  20px; 
-moz-border-radius:  20px;   

… and paste it below the rest of your code:

Save it and try it!


Last Step: Save and Upload your Work ~

If you have a web server, save your pages, upload them and attach the link to your site …


Other Resources: https://css-tricks.com/using-css-for-image-borders/ and http://www.cvwdesign.com/blog/css3-box-shadow-and-image-hover-effects and http://border-radius.com/