Create a transparent DIV

Last update on August 26, 2009 09:45 AM by jak58
Published by jad05

Create a transparent DIV




The transparent DIV in CSS



To make a transparent DIV, you can make use of the CSS techniques listed below:

Make the DIV (with the content) transparent



The div itself will be transparent, but the same aplllies for all other content such as images or text. 

<div style="filter:alpha(opacity=50); opacity:0.5;">........</div>


The opacity property is taken into account in firefox 3 +, Chrome 2 +, Safari 4 and Opera 10.
The filter:alpha(opacity=50) enables Internet Explorer 8 and Opera 9.x to make transparency.

Making transparent DIV (without the content)


Use CSS-property "rgba"

To add a color in CSS, make use the property rgb (). Soon the function rgba() will be available . The "a" is of course is for the transparency: 
<div style="background-color: rgba(255, 0, 0, 0.5)">………</div>

Here, the color red will be transparent.
This function is not recognized by Internet Explorer nor Opera 9.x (works with Opera 10).
Best answers for « Create a transparent DIV » in :
Creating transparent icons Show Creating transparent icons IcoFX PixelToolBox Creating icons is not easy and most of the editing tools don't allow you to export in the .ico format. Fortunately, there are free tools simplifying the creation of icons! IcoFX IcoFX...
Creating a local area network Show Why set up a local area network? When you have several computers, it can be convenient to connect them to each other to create a local area network (LAN). Setting up such a network costs very little, contrary to what people may think. Here are a...
Creating a LAN Show Why set up a LAN? If you have several computers, it may be worthwhile to connect them in order to create a local area network (LAN). Setting up such a network is much less expensive than what you might think. Here are a few ways you might benefit...
Creating an Autorun.inf file ShowCreating an Autorun file Allowing autorun Creating an Autorun.inf file Variations Customizing the icon Customizing the icon text Customizing the icon menu Allowing autorun Windows provide users with simple utility that runs...
Create and Open a RAR file ShowCreate and Open a RAR file *How to create a RAR file *How to open a RAR file RAR is an archive file format that is used during data compression, error recovery and file spanning. RAR is the acronym for Roshal Archive, inspired by...
Creating a Boot disk on XP ShowCreating a Boot disk on XP A boot disk is a removable storage medium from which a computer can load the OS or utility program. . You can need a boot disk for several reasons: Installing the OS. Data recovery. Data...
Download PDF Creator ShowSupports Windows 7 Beta PDFCreator is a free tool to create PDF files from almost any application that can print. It also possesses options of security allowing to code the PDF to protect their reading. PDF Creator also allows to create images...
Download The Logo Creator ShowDescription The logo creator was designed by Laughingbird Software Groups. The application is based on the creation of logos. Also, the application is available for everyone; no knowledge requirements needed to use it. Logo Creator is simple and...
Download LC ISO Creator ShowLC ISO Creator is very simple: it allows to create a .ISO file from your CD. Then, it allows you to burn these ISO files, to use CD emulation software (in order not to use any more the original CD) or to make a backup copy. The software is...
They need your help