The Bugdugle Blog Network

Web Design and e-Biz Tips

• August 3, 2007 - You've Been Framed!

You can create frames around your photographs using any background image you want for the frame—without creating new graphics. Just use this easy table technique:


<.table background="bg_name.jpg" width="220" height="300">
<.tr><.td align="center" valign="middle">
<.img src="yourPhoto.jpg" width="180" height="250">
<./td><./tr><./table>

You'll have to adjust the sizes to fit the picture you're framing and the width of the frame border you desire. Change the image source to reflect your image and add the path to image if it's kept in a different directory. The align=center centers the picture horizontally inside the table, and the valign-middle centers the picture vertically.


You can get even fancier by using CSS to define and color the frame borders. Amazing frames can be created with a little imagination and experimentation.


» Note: In code examples I had to include a period after the left arrow brackets in order to make it show up on the page. The blog software even interprets the character entities as code. To use the code example you'll have to remove the periods.


:: Send to a Friend!

About Me

Web design tips and HTML code examples from a published book author on web design. Also tips for conducting business online and other Internet related advice.

«  September 2008  »
MonTueWedThuFriSatSun
1234567
891011121314
15161718192021
22232425262728
2930 

Links

Home
Archives
My Blog's RSS
Email Me
View my profile
Entry 1 of 2
Last Page | Next Page

Powered By Bugdugle Blog Hosting