Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1448 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  débutant en html à besoin de quelque renseignements

 



 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

débutant en html à besoin de quelque renseignements

n°1318378
Profil sup​primé
Posté le 04-03-2006 à 12:07:48  answer
 

Bonjours, je viens tout juste de me mettre à "essayer" de réaliser un petit site web et j'ai déjà quelques problèmes :sweat: .
 
Alors déjà je voudrais utiliser les feuille de styles avec le css. Par exemple pour le logo j'ai fais:
 
dans le "format.css":
 
#entete {  
background-color:transparent;
width:100%;
height:10%;
float:left;
margin-left:0px;
margin-top:0px;
}
 
et dans le html:
 
<div id="entete"> <img src=img/entete.jpg alt="Logo title="Logo" >
</div>
 
 
J'ai deux petites questions, je voudrais qu'il n'y ai aucune marges de chaques coté du logo, et pourtant même après avoir rajouté "margin-left et margin top" rien n'a changé, il reste une marge.
 
et ensuite j'ai vu que l'on pouvait mettre l'adresse de l'image dans le css pour plus de souplesse mais j'ai essayé de rajouter la ligne background-image: url(".....jpg" ) en enlevant l'adresse du document .html mais dans le navigateur rien ne s'affiche :??: .
 
voila :hello:


Message édité par Profil supprimé le 04-03-2006 à 12:11:09
mood
Publicité
Posté le 04-03-2006 à 12:07:48  profilanswer
 

n°1318381
xtof_83
Freeride Spirit
Posté le 04-03-2006 à 12:14:18  profilanswer
 

Met au début de ton CSS
 
 
* {
margin:0;
padding:0;
}
 
Comme ça tu vire à tout les éléments les marges spécifié d'origine ;)

n°1318383
Profil sup​primé
Posté le 04-03-2006 à 12:16:58  answer
 

merci ;)


Message édité par Profil supprimé le 04-03-2006 à 12:17:05
n°1318388
Profil sup​primé
Posté le 04-03-2006 à 12:29:30  answer
 

sinon pour définir la taille global de ma page, il faut bien ajouter dans le css  :heink:  
 
html,body {
background-color : #FFFF88;  
width:100%;
height:100%;
}
 
ensuite les images contenu dans le body seront dimensionner par rapport à ce bout de code?

n°1318414
Profil sup​primé
Posté le 04-03-2006 à 13:59:58  answer
 

up, et sinon maintenant j'ai un marge à droite, comment l'enlever :whistle:

n°1318427
Profil sup​primé
Posté le 04-03-2006 à 14:34:06  answer
 

c'est encore moi :ange: .
 
Bon voilà, mis à part les petits problèmes évoqués ci-dessus, je suis content de mon avancé. Cependant, je vérifiais toujours la mise en page avec IE et lorsque j'ai essayé avec Firefox  :fou: , toute la mise en page est désordonnée. Pourriez vous m'aider à trouver où ca coince. merci
 

Code :
  1. html,body {
  2. background-color : #FFFF88;
  3. }
  4. * {
  5. margin:0;
  6. padding:0;
  7. }
  8. p,ul,li,td {
  9. font-size : 100%;
  10. font-family : Verdana, Arial, Helvetica, Geneva, sans-serif;
  11. color : #000000;
  12. background-color : #FFFF33;
  13. }
  14. h1 {
  15. font-size : 100%;
  16. font-family : Verdana, Arial, Helvetica, Geneva, sans-serif;
  17. color : #000000;
  18. text-align: center;
  19. }
  20. h2 {
  21. font-size : 150%;
  22. font-family : Verdana, Arial, Helvetica, Geneva, sans-serif;
  23. color : #000000;
  24. padding-right:50px;
  25. }
  26. #entete {
  27. background-color:transparent;
  28. width:101.75%;
  29. height:10%;
  30. float:left;
  31. }
  32. #menu {
  33.     height: 40px;
  34.     width: 996px;
  35.     border: solid #000 2px;
  36.     background-image: url("img/menu.jpg" )
  37. }
  38. #menu ul {
  39.     margin: 0px;
  40.     padding: 0px;
  41.     font-family: Arial, Helvetica, sans-serif;
  42.     font-size: 14;
  43.     color: #FFF;
  44.     line-height: 40px;
  45.     white-space: nowrap;
  46. }
  47. #menu li {
  48.     list-style-type: none;
  49.     display:inline;
  50. }
  51. #menu li a {
  52.     text-decoration: none;
  53.     padding: 7px 10px;
  54.     color: #000000;
  55. }
  56. #grille {
  57. background-color:transparent;
  58. width:1000px;
  59. height:1000px;
  60. float:left;
  61. background-image: url("img/grille.jpg" )
  62. }
  63. #bas {
  64. background-color:transparent;
  65. width:1000px;
  66. height:50px;
  67. float left;
  68. background-image: url("img/bas.jpg" )
  69. }


 
 
et pour le fichier html
 

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title></title>
  6. <link href="format.css" rel="stylesheet" type="text/css">
  7. </head>
  8. <body>
  9. <div id="entete"> <img src=img/entete.jpg alt="Logo title="Logo" >
  10. </div><div id="menu">
  11. <ul>
  12. <li><a href="acceuil.html" title="Page d'accueil" >Accueil</a> </li>
  13. &nbsp &nbsp &nbsp &nbsp &nbsp
  14. <li><a href="top.html">Top</a></li>
  15. &nbsp
  16. <li><a href="faq.html">FAQ</a></li>
  17. &nbsp
  18. <li><a href="contact.html">Contact</a></li>
  19. </ul>
  20. </div></div><div id="grille">
  21. </div><div id="bas">
  22. </div>
  23. </body>
  24. </html>

n°1318495
Profil sup​primé
Posté le 04-03-2006 à 17:54:44  answer
 

up :hello:

n°1318520
Profil sup​primé
Posté le 04-03-2006 à 18:58:34  answer
 

please :ange:

n°1318552
hugoOo
laisse pas dépasser ton pixel
Posté le 04-03-2006 à 20:12:36  profilanswer
 

[updéguisé]pas beaucoup de réponses! j'aurai beina aimer t'aider mais je ne connais pas la réponse![/updéguisé]

n°1318875
Profil sup​primé
Posté le 05-03-2006 à 11:42:49  answer
 

merci quand même  :D

mood
Publicité
Posté le 05-03-2006 à 11:42:49  profilanswer
 

n°1319018
baai
Posté le 05-03-2006 à 15:47:28  profilanswer
 

Manquent les guillements de fermeture après "Logo", ligne 10.
 
Pour l'espacement entre les <li>, à mon avis tu devrais plutôt définir un "margin" (left ou right) dans le CSS.
 
 
Pour la question principale, je sais pas, faudrait regarder en détail :D Proablement une histoire de boites.

n°1319040
Profil sup​primé
Posté le 05-03-2006 à 16:59:04  answer
 

je prend note ;)

n°1319075
gm_superst​ar
Appelez-moi Super
Posté le 05-03-2006 à 18:56:00  profilanswer
 

1. Tu as un </div> fermant de trop
 
2. On écrit &nbsp; avec un ; à la fin. Mais de toute façon on utilise pas de &nbsp; pour faire de la présentation, donc tu les vires.
 
3. Pourquoi mettre #entete en flottant ?


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°1323739
Profil sup​primé
Posté le 12-03-2006 à 16:51:40  answer
 

ok ;)  
 
Sinon lorsque l'on utilise la fonction map, il se créer une bordure bleu autour de l'image. Comment l'enlever?

n°1323794
xtof_83
Freeride Spirit
Posté le 12-03-2006 à 19:38:42  profilanswer
 

border:none;

n°1323796
Profil sup​primé
Posté le 12-03-2006 à 19:46:59  answer
 

merci mais ca c'est si l'image viens du css :??: . Moi je l'ai insérée dans ma page html par <img =src.......

n°1323799
zebestt
Posté le 12-03-2006 à 19:54:32  profilanswer
 

dans ton css tu defini la balise image avec attributs border:none;
 
IMG {
    border:none;
}
 
Si tu veux en savoir un peu plus sur les css je t'invite à aller sur ce site :http://www.alsacreations.com


Message édité par zebestt le 12-03-2006 à 19:58:43
n°1323800
Profil sup​primé
Posté le 12-03-2006 à 19:59:57  answer
 

ok merci, je vais aller y faire un tour

n°1323807
xtof_83
Freeride Spirit
Posté le 12-03-2006 à 20:13:50  profilanswer
 


 
 :o ça réponse qui passe trés mal ;)
 
donc fait comme conseillé...informe toi bien sur alsa de comment marche une page web  :ouch:  ;)

n°1323809
zebestt
Posté le 12-03-2006 à 20:16:02  profilanswer
 

xtof_83 a écrit :

:o ça réponse qui passe trés mal ;)
 
donc fait comme conseillé...informe toi bien sur alsa de comment marche une page web  :ouch:  ;)


Oui mais on est tous passé par là  :wahoo:  n'est-ce pas :)

n°1323832
xtof_83
Freeride Spirit
Posté le 12-03-2006 à 20:42:11  profilanswer
 

zebestt a écrit :

Oui mais on est tous passé par là  :wahoo:  n'est-ce pas :)


 
 
 :ange: heu je vois pas de quoi tu parles  :lol:

n°1323875
Fredorcs
Posté le 12-03-2006 à 21:41:45  profilanswer
 

idem mdrr xDD


---------------
A LIRE     Tout en surfant sur HARDWARE ECOUTE DLA BONNE MUSIC Clic ici tu écoutera DIRECTEMENT et là pour aller sur site de la Web radio
n°1329772
Profil sup​primé
Posté le 21-03-2006 à 20:50:56  answer
 

salut, alors voilà j'ai un dernier petit problème. Dans le css, j'ai mis:
 

Code :
  1. body {
  2. background-color:#e1e1ff;
  3. margin:0px;
  4. padding:0px;
  5. text-align:left;
  6. wight:100%;
  7. heidth:100%;
  8. }

 
 
En faite, je voudrais que quelque soit la résolution employé par le visiteur, la page soit centrée.
 
merci

n°1329894
Shinuza
This is unexecpected
Posté le 22-03-2006 à 00:22:56  profilanswer
 

Il faut que tu utilises :
 

Code :
  1. body
  2. {
  3. margin-left:auto;
  4. margin-right:auto;
  5. width:px;
  6. }


 
Tu dois définir une taille après width, en px ou %
 
Quelques remarques cependant :
 
-Range ton code, c'est assez fouilli. Utilises une tabulation par couche de contenant :
 

Code :
  1. <body>
  2. <div>
  3.  <div>
  4.  </div>
  5. </div>
  6. </body>


 
 
-Tu définis les Hx et pourtant tu ne t'en sers pas! Ils permettent de structurer la sémantique de la page. Tu dois utiliser le h1 autour de ton logo puisque tu n'as aucun gros titre pour ta page par la suite.
 
Donc à la place de ton "entete", et à la place de ton alt, mets alt="Bienvenue_blabla"
 
 
-Utilise un alt explicite pour tes images.


Message édité par Shinuza le 22-03-2006 à 00:42:56
n°1330402
Profil sup​primé
Posté le 22-03-2006 à 17:55:04  answer
 

Merci pour tes conseils shinuza. Le problème de résoltution est résolu et j'ai mieux organiser le code html  ;)

n°1330464
Shinuza
This is unexecpected
Posté le 22-03-2006 à 19:02:03  profilanswer
 

No pro, keep the Internet clean


---------------
Mains power can kill, and it will hurt the entire time you’re dying from it.
n°1331279
Profil sup​primé
Posté le 23-03-2006 à 19:07:42  answer
 

Bon allez jvai vais encore (ce devrait bientôt etre fini). Je voulais savoir quel étais l'avantage de valider son site par W3C? Parce qu'avec un tutorial de net j'avais mis au début du doc html:

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>


 
mais en faite j'ai pas l'impression d'avoir fait du xhtml. J'ai fais mon site avec les balise normal du html... En plus j'ai essayé de tester la validation d'une page sur le site de W3C et il m'a trouvé 50 fautes :whistle:

n°1331301
xtof_83
Freeride Spirit
Posté le 23-03-2006 à 20:02:43  profilanswer
 

Ben et alors 50 fautes c'est pas grave corrige tout ça vite fais ;)
 
Sinon change de doctype

n°1331327
Profil sup​primé
Posté le 23-03-2006 à 20:39:05  answer
 

xtof_83 a écrit :

Ben et alors 50 fautes c'est pas grave corrige tout ça vite fais ;)
 
Sinon change de doctype


 
 
Pourquoi et par quoi :(

n°1331336
xtof_83
Freeride Spirit
Posté le 23-03-2006 à 20:51:03  profilanswer
 

Ben si tu veux pas faire du xhtml, fait du html 4.1...
 
et si tu veux pas du strict fais du transitional
 
c'est toi qui choisi

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  débutant en html à besoin de quelque renseignements

 

Sujets relatifs
besoin d'aide plzrattacher une classe Javascript à un élément HTML
Inclure un fichier html en retirant head/body[ Besoin D'AIDE ! ] Quelques lignes de code Svp. ( noob )
[C++ débutant] Du texte en couleur dans la console ?Besoin d'aide LabView Détection de veines urgent
html ? comprends rien ?![C++ débutant] Génération d'instances dynamique (?)
Membre sur un site en HTMLRedaction de documentation HTML via Intranet
Plus de sujets relatifs à : débutant en html à besoin de quelque renseignements


Copyright © 1997-2018 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR