Pages web
antoleo
Messages postés
2
Date d'inscription
Statut
Membre
Dernière intervention
-
thomthom1 Messages postés 31 Date d'inscription Statut Membre Dernière intervention -
thomthom1 Messages postés 31 Date d'inscription Statut Membre Dernière intervention -
bonjour je suis debutant en html et css, je voudrai faire une flache sur une image ou text (passé une lumière sur un texte ou image).
A voir également:
- Pages web
- Web office - Guide
- Navigateur web - Guide
- Création site web - Guide
- Comment traduire une page web - Guide
- Capture page web - Guide
3 réponses
Salut !
Malheureusement, ce sera un poil plus compliqué que prévu. Il n'existe pas à ma connaissance de propriété CSS qui te permette directement de faire ça... Cependant, tu peux toujours importer une deuxième image plus lumineuse que la première et la faire apparaître lors d'un :hover, mais il s'agit d'une méthode assez lourde si tu n'utilise pas de sprite CSS. J'te laisse regarder par là bas si le sujet t'intéresse > http://openclassrooms.com/courses/bien-utiliser-les-sprites-css
Malheureusement, ce sera un poil plus compliqué que prévu. Il n'existe pas à ma connaissance de propriété CSS qui te permette directement de faire ça... Cependant, tu peux toujours importer une deuxième image plus lumineuse que la première et la faire apparaître lors d'un :hover, mais il s'agit d'une méthode assez lourde si tu n'utilise pas de sprite CSS. J'te laisse regarder par là bas si le sujet t'intéresse > http://openclassrooms.com/courses/bien-utiliser-les-sprites-css
Voila! J'espère que j'ai compris ce que tu voulait!!!
<!DOCTYPE html>
<html>
<head>
<title>Image Flash</title>
<meta name="description" content="CCM Flash img">
<meta charset="utf-8">
<style id="jsbin-css">
img{
width: 500px;
height: 250px;
}
p{
width: 500px;
height: 250px;
background: #fff;
margin-left: auto;
margin-right: auto;
}
img:hover{
opacity: 0.8;
}
body{
background: #555;
}
</style>
</head>
<body>
<p><img src="http://media.caranddriver.com/images/14q1/562747/2014-mclaren-p1-test-review-car-and-driver-photo-580034-s-original.jpg"></p>
</body>
</html>