Transparence d'un attribut d'un style

**hedgehog** · 27/09/2007, 10h35

Bonjour à tous,

Je cherche à modifier l'alpha d'un élément contenu dans un style.
Un exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
.monStyle {
   background-color:#FF0000;
   color:#FFFFFF;
   border:#000000 solid 1px;
   /* Transparence */
   filter:alpha(opacity=25);
   -moz-opacity:0.25;
   opacity: 0.25;
}

Je souhaite que seule la propriété background-color prenne la transparence (mon code rend toutes les propriétés transparentes

)

Est-ce possible ? Si oui, comment ?

Merci d'avance.

**onirisme** · 27/09/2007, 11h59

A part le chevauchement de div je ne vois pas...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>Untitled Document</title>
<style type="text/css">
#cadre {
	position : absolute ;
	top : 10 ;
	left : 10 ;
	height : 200px ;
	width : 400px ;
	background-color : #000000 ;
	margin : 0 ;
	padding : 0 ;
}	
#montexte {
	float : left ;
	position : absolute ;
	display : block ;
	top : 10 ;
	left : 10 ;
	float : left ;
	color:#FFFFFF;
    border:#000000 solid 1px;
 
}		
#cadre2 {
	position : absolute ;
	width : 200px ;
	height : 100px ;
	top : 10 ;
	left : 10 ;
	background-color:#FF0000;
	filter:alpha(opacity=25);
	-moz-opacity:0.25;
	opacity: 0.25;	
}
 
 
</style>
	</head>
	<body>
	    <div id="cadre">Cadre1</div>
	    <div id="cadre2"></div>
	    <div id="montexte">Mon Texte</div>
 
	</body>
</html>

Sinon, utiliser une image déjà travaillée en opacité ce qui résoudrait le problème.

**hedgehog** · 27/09/2007, 12h03

Merci de ta réponse mais j'ai oublié de préciser que c'était pour le fond d'un <input type="texte />.

Je voudrais que le fond soit d'une certaine opacité sans que les bordures et le texte qu'il contient le soit pour autant.

**onirisme** · 27/09/2007, 13h29

Dans ce cas , utilise une image, c'est ce qui a de plus simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>Untitled Document</title>
<style type="text/css">
 
input{
	background-image : url(bg.png);
	background-repeat : repeat-x;
 
}
 
 
 
</style>
	</head>
	<body>
 
	    <form>
	    	<input type="text"/>
 
	    </form>
 
	</body>
</html>