High-Tech Santé Médecine Droit-Finances

Auto-Entrepreneur

Comment faire ?

Rechercher : dans
Par :

Image découpée +css

Dernière réponse le 5 déc 2006 à 20:11:04 nov, le 4 déc 2006 à 10:43:48 
 Signaler ce message aux modérateurs

Bonjour,
je voudrais faire un bandeau avec une image découpée et insérer du flash dans le bandeau.Je ne sais pas comment m'y prendre car j'ai vu que pour les feuilles de style,il y a la propriété background-image qui permet d'insérer qu'une seule image ,j'ai une balise div qui me sert d'entete et je voudrai justement y inserer mon image découpée.J'ai essayé d'y mettre un tableau,ça marche pour IE mais pour firefox,il m'explose l'image...faudrait il que je mette plusieurs div?mais en tout cas,j'ai du mal à positionner mon image...

Meilleures réponses pour « image découpée +css » dans :
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
Découper un objet de l'arrière plan (détourage) VoirParfois on peut vouloir découper un objet de son arrière-plan, par exemple un visage, un fruit posé sur une table, etc. L'outil habituellement utilisé est le lasso, mais l'opération est délicate. On peut également utiliser des calques, mais dans...
Animer une séquence d'images avec Gimp VoirGimp permet, entre autres, de créer une animation en superposant plusieurs images. Cette animation peut alors être sauvée au format gif. Sommaire I. Images utilisées pour notre exemple II. Ouvrir la première image puis les autres en tant...
Positionner des éléments grâce aux CSS VoirIl est possible grâce aux feuilles de style de positionner au pixel près du texte ou des images grâce aux balises et . Cela est possible avec les versions 4 de Netscape et d'Internet Explorer, cependant cette technique reste hasardeuse...
Posez votre question Répondre

1

king, le 4 déc 2006 à 16:24:13

Reste à savoir comment tu as fait, firefox accepte les tableaux sans souci. C'est même plus simple pour les images, car le positionnement css et IE, c'est pas évident :-)

   
Répondre à king

2

nov, le 5 déc 2006 à 09:18:33

Voici mon code html+css:
<!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="fr" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>accueil</title>
<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
</head>

<BODY>
<div id="document">
<div id="entete">
<!-- ImageReady Slices (bandeau4.psd) -->
<TABLE WIDTH=759 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>
<TR>
<TD ROWSPAN=2>
<IMG SRC="images/bandeau1_01.gif" WIDTH=92 HEIGHT=108></TD>
<TD COLSPAN=2>
<IMG SRC="images/bandeau1_02.jpg" WIDTH=667 HEIGHT=49></TD>
</TR>
<TR>
<TD WIDTH=226 HEIGHT=59><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="226" height="59">
<param name="movie" value="bandeau.swf">
<param name="quality" value="high">
<embed src="bandeau.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="226" height="59"></embed>
</object></TD>
<TD>
<IMG SRC="images/bandeau1_04.jpg" WIDTH=441 HEIGHT=59></TD>
</TR>
</TABLE>
<!-- End ImageReady Slices -->
</div>
<div id="colonne1">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="143" height="450">
<param name="movie" value="../site2/menu.swf" />
<param name="quality" value="high" />
<embed src="../site2/menu.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="143" height="450"></embed>
</object>
</div>
<div id="colonne2">test1
</div>
<div id="pied">test2
</div>
</div>

</BODY>
</HTML>


la css:
*
{
padding: 0;
margin: 0;
border: 0;
}
body
{
background-color: #CE1D1D;

}
#document
{
width: 759px;
margin: 0 auto;
text-align: center;
background-color: #FFFFFF;
}
#document *
{
text-align: left;
}
#entete
{
height: 7em;
line-height: 7em;
}
#colonne1
{
width: 143px;
float: left;
background-color: #FFCC66;
}
#colonne2
{
width: 616px;
float: left;
background-color: #ECE9D8;
}
#pied
{
clear: left;
height: 1em;
line-height: 1em;
background-color: #006633;
}
p
{
padding: 20px;
}

   
Répondre à nov

3

king, le 5 déc 2006 à 15:42:31

Vais mâter ça de la nuit, si pas de réponse entre-temps ;-)

Si j'ai tout pigé, tu fais une ban avec plusieurs formats image, dont une en flash?

Y a un apercu on line quelque part? (histoire d'avoir une idée globale plutôt que tout ce blabla de code) :-)

   
Répondre à king

4

nov, le 5 déc 2006 à 16:02:45

Merci d'avoir voulu m'aider mais en fait j'ai résolu une partie du probleme!
il suffisait d'enlever la 1ère ligne du code html c'est à dire:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
ainsi que d'ajouter une balise <center> et voila maintenant ça marche nickel sous IE et firefox!
si je ne mettais pas <center> mon document n'était pas centré sous IE.Par contre,sous firefox,c'était centré mais maintenant que j'ai rajouté cette balise ,ça marche bien sous IE et firefox!

voilà,par contre,je ne sais pas s'il faut que j'utilise des tableaux pour le contenu de ma page car mon contenu est divisé en 3 partie ,une partie texte à gauche,une image survolée de fleche au 2/3 et enfin une photo à droite,et ceci 3 fois ,au départ j'ai fait 9 cellules...
t'en pense quoi sachant que j'ai eu des probleme de dépassement du cadre de mon document avec les tableaux,ça serait pas mieux avec des div ou span?

   
Répondre à nov

5

 king, le 5 déc 2006 à 20:11:04

Disons qu'avec le css, qui plus est en externe, tu y gagnes en poids sur la page, une meilleur lecture pour les moteurs, une facilité pour les changements etc. et peut-être (pour ne pas dire certainement) quelques embrouilles de compréhension pour IE (mais là, on finit par mâter la bête quand même) :-)

Celat dit, on peut aussi mélanger les 2, les tableaux sont des fois bien utils.

   
Répondre à king
Posez votre question Répondre
Ils ont besoin de votre aide