cadre photo 3 couches en CSS

cadre photo 3 couches en CSS - HTML/CSS - Programmation

Marsh Posté le 21-09-2006 à 22:35:23    

Salut,
parlons franchement, j'ai découvert les css y a 3 semaines, depuis je bosse très dur pour tout assimiler et je ne me sert pus que de ça maintenant.
Actuellement j'essaie de me faire une petite galerie, et j'en arrive à mon "probleme"
je souhaite faire un cadre à mes photos du genre ça :
http://img242.imageshack.us/img242/497/abeille10wh8.th.jpg
 
comme un sandwish, filet noir, contour blanc, filet noir...
 
mon image en html se présente comme suit :

Code :
  1. <a id="img" href="gf/pascal 3.jpg" target="img" ><img id="img" src="pf/pascal 3.jpg" /></a>


 
et actuellement j'arrive à un résultat proche : contour blanc et liseret noir, me manque le 1er liseret, délimitant la photo
mon css ressemble à ça:

Code :
  1. img#img {
  2. color: #FFFFFF;
  3. border: 20px solid #FFFFFF;
  4. }
  5. a#img {
  6. border: 2px solid #000;
  7. }


où placer ma bordure supplémentaire?
là j'avoue, je bloque...
 
si vous avez des pistes, je suis prenneur !  :pt1cable:  
 
d'avance merci !


---------------
c'est au pied du mur que l'on voit le mieux le mur !
Reply

Marsh Posté le 21-09-2006 à 22:35:23   

Reply

Marsh Posté le 21-09-2006 à 22:54:06    

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  3. <html>
  4. <head>
  5. <title>Untitled</title>
  6. <style>
  7. .img {border:1px solid black; display:-moz-inline-box; display:inline-block;}
  8. .img img {margin:4px; border:none; display:block}
  9. .img span {background:black; color:white; display:block; font-size:10px; font-family:verdana, arial}
  10. </style>
  11. </head>
  13. <body>
  16. <a href="#" class="img">
  17. <img src="http://images.google.fr/images?q=tbn:OGtVX6tKpyRiWM:http://www.futura-sciences.com/img/chien.jpg">
  18. <span>145x54 145 kb</span>
  19. </a>
  21. </body>
  22. </html>


:o
in id c'est unique dans une page donc utilise une classe :o
tu fous juste une classe sur le parent et tu découle le merdier ensuite comme j'ai fait


Message édité par gatsu35 le 21-09-2006 à 22:54:50
Reply

Marsh Posté le 21-09-2006 à 23:47:30    

ok, merci bcp !
pour les id, depuis que j'ai decouvert ça, j'en mets partout, et parfois les meme, c'est vraiment grave s'ils ne sont plus unique?


---------------
c'est au pied du mur que l'on voit le mieux le mur !
Reply

Marsh Posté le 21-09-2006 à 23:54:09    

oui c'est grave, un id c'est unique et ca restera unique :o
car si tu fais un getElementById("monid" ) en Javascript, ben il va retourner quel élément ???
Normalement le premier qui possede l'id en question mais  bon on sait jamais.
et puis pour styler en CSS l'id se met sur un élément parent global. pas sur tous les enfants.
 
 

Reply

Marsh Posté le 22-09-2006 à 00:37:20    

ok, je vais revoir ma copie alors.
donc dès qu'elles ne sont plus unique, il faut que je remplace mes id par des class ?...
 
Merci pour ton aide !


---------------
c'est au pied du mur que l'on voit le mieux le mur !
Reply

Marsh Posté le 22-09-2006 à 01:46:15    

la reponse est oui :o
avec un petit article en prime :o  
http://css.alsacreations.com/Bases [...] e-et-un-id
et aussi ceci :  
http://www.pompage.net/pompe/terminologie/

Reply

Marsh Posté le 22-09-2006 à 18:58:16    

ok, impecable, merci.
j'aurais appris quelquechose !


---------------
c'est au pied du mur que l'on voit le mieux le mur !
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed