Best 4 CSS Tricks – Protect your Images & Text

May 25th, 2010 by admin Leave a reply »

My 5 Best CSS Tricks, i am use this all tricks for improve my design skill(i am not a designer :)

1. Border with Dashed using CSS:

Working Preview:

Code: Insert this code in your CSS file or if you’re use Internal CSS then also you can put this code in <div>your css code</div>

border: 2px dashed #cccccc;

you can change size and color

2. Image Hover & Border Hover:

without mouse hover image

mouse hover image

CSS Code for Image Hover – Border Hover:

a:hover img { border: 2px solid #B3B3B3; }

Demo Page

3. Most Important Trick for Protecting Your Images!

Its a my Small Trick, Just create a Transparent 1×1 pixel image in Photoshop and increase image size then put image on your image.

Working Demo: You can’t select or save this image

its a nice trick?

You can protect your image using DIV Code.

<div id=”image1″ style=”overflow: hidden; position: absolute; left: 8px; top: 649px; width: 110px; height: 35px; z-index: 0;”><img title=”Protect Images” src=”http://blog.dewlance.com/wp-content/uploads/2010/05/myprotectedimage.gif” border=”0″ alt=”” width=”110″ height=”35″ /></div>

<div id=”image2″ style=”overflow: hidden; position: absolute; left: 7px; top: 647px; width: 112px; height: 38px; z-index: 1;”><img title=”Protect Images” src=”http://blog.dewlance.com/wp-content/uploads/2010/05/1pixel-transparentimage.gif” border=”0″ alt=”” width=”1″ height=”1″ /></div>

Red Color Link is my Image and Orange Color Link is Protect my Image because of its a transparent image and not eat disk space because of its a only 1 pix image – size is: 43 Bytes only.

4. Protect Your Text Contents:

you can protect your text contents, use same trick.

<div id=”image2″ style=”overflow: hidden; position: absolute; left: 7px; top: 647px; width: 112px; height: 38px; z-index: 1;”><img title=”Protect Images” src=”http://blog.dewlance.com/wp-content/uploads/2010/05/1pixel-transparentimage.gif” border=”0″ alt=”” width=”1″ height=”1″ /></div>

My Protected Text, You can’t select or save this text.

Please Note: its not a perfect trick for protecting text or images, i think its a impossible to protect image or text contents. but this trick avoid copying images and text contents.

sorry for bad english but you can do this very easly.

this post is look like a Garbage :)

Advertisement

Leave a Reply