Se connecter avec
S'enregistrer | Connectez-vous

background image

Dernière réponse : dans Programmation
Lassé par la pub ? Créez un compte

Je crois qu'il faut que tu rajoutes la fonction z-index en ce qui concerne les calques...
"
Placer entre les balises <body> et </body>

<div id="Layer1" style="position: absolute; overflow: auto; left: 150px; top: 150px; width: 639px; height: 389px; z-index: 1; background: #999999; vertical-align: middle">

Explications complémentaires :
Layer1 : Nom du calque, à changer pour en utilisez plusieurs
Overflow :auto : effacer ce code si vous ne voulez pas qu’il y ait une scollbar dans votre calque
Top : Position en nombre de pixel à partir du haut de la page
Left : Position en nombre de pixel à partir de la partie gauche de la page
width=639px : largeur du calque
height=389px : hauteur du calque.
z-index :x : remplacer x par un chiffre, le calque de z-index : 1 se trouve en dessous du z-index :2 qui se trouve en dessous du z-index :3 et ainsi de suite….
background: #999999 : Couleur du fond du calque
"

salut, j'ai vu ton post sur sdz, mais les "dns" de free me renvoie sur un autre site !

essaie ceci:
  1. <div style="background: url(test2_fichiers/image005.jpg);position:absolute; margin-left:27.8pt;margin-top:-30.75pt;width:681.75pt; height:1233.75pt">mon texte dans mon div, blabla bla bla bli bloup !</div>


ton position:absolute fixe ton div sur ta page en le sortant du flux(ce qui le superpose au reste de ton code html qui lui est dans le flux), et sur le code que tu presente ton div n'a rien d'autre qu'une image d'arriere plan, donc si tu veux afficher un texte sur l'image d'arriere plan tu dois le mettre dans le div pour qu'il se retrouve en avant plan !

j'espere etre clair et avoir mis le doigt sur ta petite erreur

a plus

(lol mois aussi je vieny la paske le sdz merde ^^)
oui mais le pb c'est que le texte que je vais mettre entre les <div>et</div> contien lui aussi des <div>et</div>, donc qu premier </div> venu, le <div style='...'> sera fini ! (y'a quand meme tout un site sur l'image !)

le truc du z-index: -5 marche bien... mais que sur IE :p 

help ! comment je fait sur FF ?!

voilou :

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "<a href="http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" target="_blank">http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd</a>">
  2. <html xmlns="<a href="http://www.w3.org/1999/xhtml" target="_blank">http://www.w3.org/1999/xhtml</a>" xml:lang="fr" >
  3. <style>
  4. p.MsoNormal, li.MsoNormal, div.MsoNormal
  5. {
  6. mso-style-parent:"";
  7. margin:0cm;
  8. margin-bottom:.0001pt;
  9. mso-pagination:widow-orphan;
  10. font-size:12.0pt;
  11. font-family:"Times New Roman";
  12. mso-fareast-font-family:"Times New Roman";
  13. }
  14. body {background-color:#999999;}
  15. #aa {
  16. background: url(<a href="http://tipaldi.free.fr/CJTV/test2_fichiers/image005.jpg" target="_blank">http://tipaldi.free.fr/CJTV/test2_fichiers/image005.jpg</a>);
  17. position:absolute;
  18. margin-left:27.8pt;
  19. margin-top:-30.75pt;
  20. width:681.75pt;
  21. height:1233.75pt;
  22. z-index: -0;/* ici la difference ! */
  23. </style>
  24.  
  25. <body>
  26.  
  27.  
  28. <head>
  29.  
  30. <meta name="keywords" content="CJTV, Arthur, TIPALDI, fun, videos, parodies, gratuit, CrazyJester, cj, COINTIN" />
  31. <meta name="description" content="Un site de ouf', mon premier site en PHP avec
  32. toutes mes videos de merde et bien sur aussi comme partout des videos pompées sur d'autres sites.
  33. Fun, délire, par Arthur TIPALDI alias CrazyJester ou cj" />
  34. <meta name="author" content="cj" />
  35. <meta name="copyright" content="Copyright © pas de copyright: amusez-vous !" />
  36.  
  37.  
  38. <title>[CJTV] :: BIENVENU.wmv</title>
  39.  
  40.  
  41. <div id ="aa"></div>
  42.  
  43.  
  44. <embed src="BIENVENU.wmv" loop="false" controller="true" autoplay="true" alt="CJTV" style='position:absolute;
  45. margin-left:247pt;margin-top:98.6pt;width:258.15pt;height:230.0pt;z-index:5'>
  46.  
  47.  
  48.  
  49.  
  50. <fieldset style="background-color: orange; color: black; font-size: 11px; font-family:arial; padding: 5px;
  51. margin-top: 75px; margin-right: 5px; width:100pt; position: fixed; text-align: justify">
  52. <legend style="font-size: 14px; color: grey; font-weight: bold;"> NewsLetter : </legend>
  53. <form method="post" action="newsletter.php">
  54. <textarea name="ouinon" cols="13" rows="1" value="oui">oui</textarea>
  55. je souhaite recevoir un mail m'informant de l'ajout d'une nouvelle video...
  56.  
  57.  
  58. mon e-mail ou hotmail:<br/>
  59. <textarea name="mail" cols="13" rows="1"></textarea>
  60.  
  61. <input type="submit" value="------inscription------" />
  62. </fieldset></form>
  63.  
  64. <p style="margin-left:140.4pt; margin-top:486.15pt; width:300pt; height:461.95pt; position: absolute;
  65. overflow: auto; border-right:1px solid black; text-align: justify">
  66. <br align=center><u><span
  67. style='font-size:14.0pt;font-family:"Arial Black"'>Tipaldi-Cointin :<o:p></o:p></span></u></br>
  68. <br><o:p> </o:p></br>
  69. <br/>
  70.  
  71.  
  72.  
  73. <span style='font-size:9.0pt;font-family:Arial;color:red'>14/06 - 15 h 54 :<o:p></o:p></span>
  74. <br/><b style='font-size:12.0pt;font-family:Arial;'> <a href="CJTV00.php?video=BilLard.wmv">BilLard</a> <o:p></o:p></b>
  75. <br/><span style='font-size:10.0pt'>C'est notre premiere video, bien a l'arrache ^^
  76. Celle qui nous a lancée dans le tournages de films pourris<o:p></o:p></span>
  77. <br/><a> </a><br/>
  78.  
  79.  
  80.  
  81.  
  82.  
  83.  
  84.  
  85. <span style='font-size:9.0pt;font-family:Arial;color:red'>14/06 - 16 h 05 :<o:p></o:p></span>
  86. <br/><b style='font-size:12.0pt;font-family:Arial;'> <a href="CJTV00.php?video=Boules.wmv">Boules</a> <o:p></o:p></b>
  87. <br/><span style='font-size:10.0pt'>Une deuxieme video qu'on a tournée dans la foulée le meme jour.
  88. Toujours a l'arrache, mais ca nous fait bien marrer :P<o:p></o:p></span>
  89. <br/><a> </a><br/>
  90.  
  91.  
  92.  
  93.  
  94.  
  95.  
  96.  
  97. <span style='font-size:9.0pt;font-family:Arial;color:red'>14/06 - 16 h 07 :<o:p></o:p></span>
  98. <br/><b style='font-size:12.0pt;font-family:Arial;'> <a href="CJTV00.php?video=CS.wmv ">ParodieCS #1</a> <o:p></o:p></b>
  99. <br/><span style='font-size:10.0pt'>Notre premiers film "reflechit" qui parodie le célebre jeux Counter-Strike<o:p></o:p></span>
  100. <br/><a> </a><br/>
  101.  
  102.  
  103.  
  104.  
  105.  
  106.  
  107.  
  108. <span style='font-size:9.0pt;font-family:Arial;color:red'>14/06 - 16 h 08 :<o:p></o:p></span>
  109. <br/><b style='font-size:12.0pt;font-family:Arial;'> <a href="CJTV00.php?video=nuuul.wmv ">Nous en Vrac</a> <o:p></o:p></b>
  110. <br/><span style='font-size:10.0pt'>Ben voila quoi... c'est un peut nous en vrac quoi, du bon n'importe quoi<o:p></o:p></span>
  111. <br/><a> </a><br/>
  112.  
  113.  
  114.  
  115.  
  116.  
  117.  
  118.  
  119. <span style='font-size:9.0pt;font-family:Arial;color:red'>14/06 - 16 h 08 :<o:p></o:p></span>
  120. <br/><b style='font-size:12.0pt;font-family:Arial;'>
  121. <a href="CJTV00.php?video=PasQueDeLaChatte.wmv ">Pas Que De La Chatte! #1</a> <o:p></o:p></b>
  122. <br/><span style='font-size:10.0pt'>On s'est mis au BasketBall !
  123. Pas de trucages, on s'est juste vu tous les apres-midis pendant 3 semaines...
  124. d'autres paniers encors plus fous a venir !..<o:p></o:p></span>
  125. <br/><a> </a><br/>
  126.  
  127.  
  128.  
  129.  
  130.  
  131. <a name="fin"></a>
  132. </p>
  133.  
  134.  
  135. <p style="margin-left:445pt; margin-top:486.15pt; width:241pt; height:461.95pt;
  136. position: absolute; overflow: auto; border-left:0px solid black; text-align: justify">
  137. <br align=center><u><span
  138. style='font-size:14.0pt;font-family:"Arial Black"'>Liens :<o:p></o:p></span></u></br>
  139. <br><o:p> </o:p></br>
  140. </p>
  141.  
  142. </body>
  143.  
  144.  
  145.  
  146. <p class=MsoNormal align='center' style='font-size:10.0pt;color:orange'><a>en cours:</a> BIENVENU.wmv<o:p> </o:p></p>
  147.  
  148. <p size=18 align='center' class=MsoNormal style='font-size:14.0pt'>
  149. <a>---</a><a target="_BLANK" href="BIENVENU.wmv">telecharger la video</a><a>---</a>
  150. <a target="_BLANK" href=mailto:cj_cacom@hotmail.com>m'ecrire</a><a>---</a>
  151. <a target="_BLANK" href="livreor.php?page=1">livre d'or</a><a>---</a>
  152.  
  153. <o:p> </o:p></p>
  154.  
  155. <p class=MsoNormal style='font-size:2.0pt;color:orange'><o:p> </o:p></p>
  156.  
  157. <p class=MsoNormal><o:p> </o:p></p>
  158.  
  159. <p class=MsoNormal><o:p> </o:p></p>
  160.  
  161. <p class=MsoNormal><o:p> </o:p></p>
  162.  
  163. <p class=MsoNormal><o:p> </o:p></p>
  164.  
  165. <p class=MsoNormal><o:p> </o:p></p>
  166.  
  167. <p class=MsoNormal><o:p> </o:p></p>
  168.  
  169. <p class=MsoNormal><o:p> </o:p></p>
  170.  
  171. <p class=MsoNormal><o:p> </o:p></p>
  172.  
  173. <p class=MsoNormal><o:p> </o:p></p>
  174.  
  175. <p class=MsoNormal><o:p> </o:p></p>
  176.  
  177. <p class=MsoNormal><o:p> </o:p></p>
  178.  
  179. <p class=MsoNormal align='center' style='font-size:18.0pt;color:orange'><o:p> </o:p></p>
  180.  
  181. <p class=MsoNormal align='center' ;color:orange'><o:p> </o:p></p>
  182.  
  183. <p class=MsoNormal align='center' style='font-size:5.0pt;color:orange'><o:p> </o:p></p>
  184.  
  185. <p class=MsoNormal><o:p> </o:p></p>
  186.  
  187. <p class=MsoNormal><o:p> </o:p></p>
  188.  
  189. <p class=MsoNormal><o:p> </o:p></p>
  190.  
  191. <p class=MsoNormal><o:p> </o:p></p>
  192.  
  193. <p class=MsoNormal><o:p> </o:p></p>
  194.  
  195. <p class=MsoNormal><o:p> </o:p></p>
  196.  
  197. <p class=MsoNormal><o:p> </o:p></p>
  198.  
  199. <p class=MsoNormal><o:p> </o:p></p>
  200.  
  201. <p class=MsoNormal><o:p> </o:p></p>
  202.  
  203. <p class=MsoNormal align='center' style='font-size:0.0pt;color:orange';><o:p> </o:p></p>
  204.  
  205. <p class=MsoNormal><o:p> </o:p></p>
  206.  
  207. <p class=MsoNormal><o:p> </o:p></p>
  208.  
  209. <p class=MsoNormal><o:p> </o:p></p>
  210.  
  211. <p class=MsoNormal><o:p> </o:p></p>
  212.  
  213. <p class=MsoNormal><o:p> </o:p></p>
  214.  
  215. <p class=MsoNormal><o:p> </o:p></p>
  216.  
  217. <br style='mso-ignore:vglayout' clear=ALL>
  218.  
  219.  
  220.  
  221. <p class=MsoNormal><span style='mso-tab-count:15'>
  222.  
  223.  
  224.  
  225.  
  226.  
  227.  
  228.  
  229. </span></p>
  230.  
  231.  
  232.  
  233.  
  234.  
  235. <p style="margin-left:430pt; margin-top:0pt; position: absolute; border-left:0px solid black" class=MsoNormal>
  236. <span style='mso-tab-count:13'> </span><span
  237. > </span><b style='mso-bidi-font-weight:
  238. normal'><span style='font-family:"Arial Black";color:red'>
  239. 15/06/2005 - 20 h 47<o:p></o:p></span></b></p>
  240.  
  241.  
  242.  
  243.  
  244.  
  245. <p class=MsoNormal align='center' style='font-size:16.0pt;color:orange';><o:p> </o:p></p>
  246.  
  247. <p class=MsoNormal><o:p> </o:p></p>
  248.  
  249. <p class=MsoNormal><o:p> </o:p></p>
  250.  
  251. <p class=MsoNormal><o:p> </o:p></p>
  252.  
  253. <p class=MsoNormal><o:p> </o:p></p>
  254.  
  255. <p class=MsoNormal><o:p> </o:p></p>
  256.  
  257. <p class=MsoNormal><o:p> </o:p></p>
  258.  
  259. <p class=MsoNormal><o:p> </o:p></p>
  260.  
  261. <p class=MsoNormal><o:p> </o:p></p>
  262.  
  263. <p class=MsoNormal><o:p> </o:p></p>
  264.  
  265. <p class=MsoNormal><o:p> </o:p></p>
  266.  
  267. <p class=MsoNormal><o:p> </o:p></p>
  268.  
  269. <p class=MsoNormal><o:p> </o:p></p>
  270.  
  271. <p class=MsoNormal><o:p> </o:p></p>
  272.  
  273. <p class=MsoNormal><o:p> </o:p></p>
  274.  
  275. <p class=MsoNormal><o:p> </o:p></p>
  276.  
  277. <p class=MsoNormal><o:p> </o:p></p>
  278.  
  279. <p class=MsoNormal><o:p> </o:p></p>
  280.  
  281. <p class=MsoNormal><o:p> </o:p></p>
  282.  
  283. <p class=MsoNormal><o:p> </o:p></p>
  284.  
  285. <p class=MsoNormal><o:p> </o:p></p>
  286.  
  287. <p class=MsoNormal><o:p> </o:p></p>
  288.  
  289. <p class=MsoNormal><o:p> </o:p></p>
  290.  
  291. <p class=MsoNormal><o:p> </o:p></p>
  292.  
  293. <p class=MsoNormal><o:p> </o:p></p>
  294.  
  295. <p class=MsoNormal><o:p> </o:p></p>
  296.  
  297. <p class=MsoNormal><o:p> </o:p></p>
  298.  
  299. <p class=MsoNormal><o:p> </o:p></p>
  300.  
  301. <p class=MsoNormal><o:p> </o:p></p>
  302.  
  303. <p class=MsoNormal><o:p> </o:p></p>
  304.  
  305. <p class=MsoNormal><o:p> </o:p></p>
  306.  
  307. <p class=MsoNormal><o:p> </o:p></p>
  308.  
  309. <p class=MsoNormal><o:p> </o:p></p>
  310.  
  311. <p class=MsoNormal><o:p> </o:p></p>
  312.  
  313. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  314.  
  315. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  316.  
  317. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  318.  
  319. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  320.  
  321.  
  322.  
  323. <p class=MsoNormal align=center style='text-align:center'><span
  324. style='mso-tab-count:1'> </span><b
  325. style='mso-bidi-font-weight:normal'><span style='color:black'> <a href="CJTV.php?video=CJTV.gif"> </a> <span
  326. style='mso-tab-count:7'> </span> <a href="CJTV.php?video=CJTV.gif"> </a> <span style='mso-tab-count:2'> </span>
  327. <o:p></o:p></span></b></p>
  328.  
  329. <p class=MsoNormal align=center style='text-align:center'><b style='mso-bidi-font-weight:
  330. normal'><span style='font-size:10.0pt;color:black'><span
  331. style='mso-tab-count:7'></span>
  332.  
  333.  
  334.  
  335. </span> </b><span style='font-size:10.0pt'><o:p></o:p></span></p>
  336.  
  337.  
  338.  
  339. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  340.  
  341. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  342.  
  343. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  344.  
  345. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  346.  
  347. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  348.  
  349. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  350.  
  351. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  352.  
  353. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  354.  
  355. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  356.  
  357. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p>
  358.  
  359. <p class=MsoNormal align=center style='text-align:center'><o:p> </o:p></p><a name="minichat"></a>
  360.  
  361.  
  362.  
  363.  
  364.  
  365.  
  366. </div>
  367.  
  368. </body>
  369.  
  370. </html>


bon, maintenant pour faire ta page vraiment dans l'idée du xhtml il faut que tu sorte tout le style (css) de la page et que tu mette ça dans un fichier css, tu verra ce sera beaucoup plus facile a faire.
bon courage
a plus
Lassé par la pub ? Créez un compte
Tom's guide dans le monde