Fond de contenu avec coin arrondi en CSS
Résolu
nheavy
Messages postés
42
Date d'inscription
Statut
Membre
Dernière intervention
-
ARM.0fees.net -
ARM.0fees.net -
A voir également:
- Fond de contenu avec coin arrondi en CSS
- Comment mettre une vidéo en fond d'écran - Guide
- Fusionner deux cellules excel en gardant le contenu - Guide
- Fond de page word - Guide
- Créer un compte le bon coin - Guide
- Trame de fond word - Guide
4 réponses
Code HTML
Code CSS
<table id="table" cellspacing="0" cellpadding="0">
<tr>
<td id="table_haut"></td>
</tr>
<tr>
<td id="table_milieu">Contenu sur le fond arrondi</td>
</tr>
<tr>
<td id="table_bas"></td>
</tr>
</table>
Code CSS
#table {
width: 956px;
}
#table_haut {
background-color: #404040;
-moz-border-radius: 7 7 0 0;
height: 12px;
}
#table_milieu {
background-color: #404040;
padding: 0 2 0 2;
}
#table_bas {
background-color: #404040;
-moz-border-radius: 0 0 7 7;
height: 12px;
}
Merci pour ta réponse, ça m'intéresse mais est-ce qu'il n'existerait pas une solution pour que ce tableau prenne la place de l'élément background-color ou bg-image du contenu de mon site?
On m'a donné une autre solution sur un autre site:
Dans le CSS:
Dans la page HTML:
Il faut mettre une <div> avec un numéro différent pour chaque cadre arrondi qu'on veut mettre sur une même page.
Dans le CSS:
<script type="text/javascript">
function fondArrondis() {
var fond1 = '<table width="956px" cellspacing="0" cellpadding="0"><tr height="12px"><td width="11px"background="http://s3.e-monsite.com/2010/08/01/12/HD.gif"></td><td width=934px bgcolor="#404040"></td><td width="11px" background="http://s3.e-monsite.com/2010/08/01/12/HG.gif" ></td></tr><tr><td bgcolor="#404040"></td><td bgcolor="#404040">';
var fond2 = '</td><td bgcolor="#404040"></td></tr><tr height="12px"><td background="http://s3.e-monsite.com/2010/08/01/12/BG.gif"></td><td width=934px bgcolor="#404040"></td><td width="11px" background="http://s3.e-monsite.com/2010/08/01/12/BD.gif" ></td></tr></table>';
for (var i = 0; i < $("#contenu div").length; i++) {
idDiv = "arrondis" + (i+1);
var obj = document.getElementById(idDiv);
if (obj) {
contenuFond = obj.innerHTML;
obj.innerHTML = fond1 + contenuFond + fond2;
}}}
$(document).ready(function(){fondArrondis();});
</script>
Dans la page HTML:
<div id="arrondis1"> \*Contenu sur le fond arrondi 1*/ </div> <div id="arrondis2"> \*Contenu sur le fond arrondi 2*/ </div> <div id="arrondis3"> \*Contenu sur le fond arrondi 3*/ </div> etc.
Il faut mettre une <div> avec un numéro différent pour chaque cadre arrondi qu'on veut mettre sur une même page.
