Box déroulante html5

par **Erika** » 16 mai 2011, 18:54

Re,

Zut, personne ne sait ?
En fait, je souhaite faire ce que Detail et summary feront bientôt en html 5.
On pourrait aussi dire... rendre visible une boite.

Merci bien
Erika

par **Erika** » 07 mai 2011, 12:55

Bonjour,
Je souhaite afficher des rubriques contenant un titre et plusieurs lignes d'information.
Mon idée est d'afficher une box avec uniquement le titre. En cliquant sur "plus", ça déroulerait la boite et afficherait toute l'information.
Voici mes deux fichiers :

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>rubrique</title>

<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>

<div class="boxrubrique">
<h2>Titre de la rubrique</h2>
<p>bla bla</p>
<p>bla bla</p>
<p>bla bla bla</p>
</div>


</body>
</html>

----------------------------------

Code : Tout sélectionner

.boxrubrique {
	width: 30em;
	background-color: #89ac11;
	color: #fff;
	margin-top: 1em;
	padding-top: 2em;
	padding-right: 2em;
	padding-bottom: 1em;
	padding-left: 2em;
}

h2 {
	margin-top: 0;
	font-size: 1.6em;
}

.boxrubrique {
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	/* pour obtenir l'effet ombré ces trois balise*/	
	box-shadow: 3px 3px 6px #666;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow : 3px 3px 6px #666;
}

Merci pour votre aide.
Erika

Box déroulante html5

Répondre

Étendre la vue Revue du sujet : Box déroulante html5

Re: Box déroulante html5

Box déroulante html5