Menu qui bouge apres insertion image
arcad16
-
notobe Messages postés 1952 Date d'inscription Statut Membre Dernière intervention -
notobe Messages postés 1952 Date d'inscription Statut Membre Dernière intervention -
Bonjour à tous
Voila, j'ai attaqué ce weekend un petit site internet sur dreamweaver en html sans auqu'une notion et je peux vous dire franchement que je galère pas mal.
Je cherche à faire le truc le plus simple possible, mais même ca, je n'y arrive pas, je vous explique :
j'ai un menu a gauche.
J'aimerais que ce menu ne bouge pas, qu'il soit fixe car, quand je veux mettre une vidéo centré ou une image tout se décale !
si je mets une video en haut centré, le menu de gauche déscend...
voici mon code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" type="image/x-icon" href="images/am.ico"/>
<title>titre du site</title>
<style type="text/css">
body,td,th {
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
color: #000;
}
body {
background-color: #FFF;
background-image: url(images/motif1.png);
font-size: 11px;
}
body p {
font-family: Arial, Geneva, sans-serif;
margin: 20px;
}
a {
color: #000000;
text-decoration:none;
font-family:Arial,Verdana;
}
a:hover {
color: #3399ff;
text-decoration:none;
font-family:Arial,Verdana;
}
a:visited {
color: #000000;
text-decoration:none;
font-family:Arial,Verdana;
}
</style>
</head>
<body>
<h1> </h1>
<p><span style="background:#66ccff"><a href="http://www.monsite.com/" target="parent">mon nom</a></span></p>
<p>
<span style="background:#FFFFFF">profession</span>
</p>
<p><span style="background:#FFFFFF">TEL</span>
</p>
<p><span style="background:#FFFFFF"><a href="mailto:mail@mail.com">mail@mail.com</a></span><p/>
<p> </p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages2" target="parent">menu2</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages3" target="parent">menu3</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages4" target="parent">menu4</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages5" target="parent">menu5</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages6" target="parent">menu6</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages7" target="parent">menu7</a></span></p>
</body>
</html>
Aidez moi s'il vous plait, j'en es mal à la tête tellement !!
Merci :)
Voila, j'ai attaqué ce weekend un petit site internet sur dreamweaver en html sans auqu'une notion et je peux vous dire franchement que je galère pas mal.
Je cherche à faire le truc le plus simple possible, mais même ca, je n'y arrive pas, je vous explique :
j'ai un menu a gauche.
J'aimerais que ce menu ne bouge pas, qu'il soit fixe car, quand je veux mettre une vidéo centré ou une image tout se décale !
si je mets une video en haut centré, le menu de gauche déscend...
voici mon code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" type="image/x-icon" href="images/am.ico"/>
<title>titre du site</title>
<style type="text/css">
body,td,th {
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
color: #000;
}
body {
background-color: #FFF;
background-image: url(images/motif1.png);
font-size: 11px;
}
body p {
font-family: Arial, Geneva, sans-serif;
margin: 20px;
}
a {
color: #000000;
text-decoration:none;
font-family:Arial,Verdana;
}
a:hover {
color: #3399ff;
text-decoration:none;
font-family:Arial,Verdana;
}
a:visited {
color: #000000;
text-decoration:none;
font-family:Arial,Verdana;
}
</style>
</head>
<body>
<h1> </h1>
<p><span style="background:#66ccff"><a href="http://www.monsite.com/" target="parent">mon nom</a></span></p>
<p>
<span style="background:#FFFFFF">profession</span>
</p>
<p><span style="background:#FFFFFF">TEL</span>
</p>
<p><span style="background:#FFFFFF"><a href="mailto:mail@mail.com">mail@mail.com</a></span><p/>
<p> </p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages2" target="parent">menu2</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages3" target="parent">menu3</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages4" target="parent">menu4</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages5" target="parent">menu5</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages6" target="parent">menu6</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages7" target="parent">menu7</a></span></p>
</body>
</html>
Aidez moi s'il vous plait, j'en es mal à la tête tellement !!
Merci :)
A voir également:
- Menu qui bouge apres insertion image
- Image en 3d qui bouge - Télécharger - Thèmes & Fonds d'écran
- Insertion menu déroulant excel - Guide
- Image iso - Guide
- Insertion sommaire word - Guide
- Insertion filigrane word - Guide
3 réponses
Petite remarque préliminaire qui va alléger pas mal le code : virer tous les <span style="background:#FFFFFF"> qui ne servent à rien puisque la couleur déclarée dans le body est déjà blanche.
Sinon, un menu ne se fait pas avec des paragraphes normalement, mais plutôt avec une liste.
Pour fixer le menu, il y a différentes méthodes. Cela peut être un positionnement flottant, ou absolu (plus difficile à maitriser quand on débute)
Un petit exemple ce qui peut être fait :
http://css.mammouthland.net/mise-en-page-sans-tableau.php
Ou prendre un de ces gabarits :
http://www.alsacreations.com/static/gabarits/liste.html
Sinon, un menu ne se fait pas avec des paragraphes normalement, mais plutôt avec une liste.
Pour fixer le menu, il y a différentes méthodes. Cela peut être un positionnement flottant, ou absolu (plus difficile à maitriser quand on débute)
Un petit exemple ce qui peut être fait :
http://css.mammouthland.net/mise-en-page-sans-tableau.php
Ou prendre un de ces gabarits :
http://www.alsacreations.com/static/gabarits/liste.html
Je suis désolé, mais je ne comprends vraiment rien, je suis un vrai débutant !
Je n'arrive même pas a comprendre le gabarit, j'ai fait plusieurs test et rien ne marche !
J'ai l'impression que je vais devoir repartir de zero, mais je ne sais même pas par ou commencer !
J'ai fixé mon menu à gauche, mais si je veux ajouter une image à droite, il me l'ajoute tout en bas
Je n'arrive même pas a comprendre le gabarit, j'ai fait plusieurs test et rien ne marche !
J'ai l'impression que je vais devoir repartir de zero, mais je ne sais même pas par ou commencer !
J'ai fixé mon menu à gauche, mais si je veux ajouter une image à droite, il me l'ajoute tout en bas
Si vous ne comprenez rien au tuto, c'est effectivement qu'il faut commencer par le commencement et ne pas brûler les étapes. ;)
Étant donné que votre code html n'est pas foncièrement mauvais, il faut "juste" bien comprendre les CSS. Reprenez CSS débutant à partir de la home page http://css.mammouthland.net/
Sinon, il y a aussi le site du zéro https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3
Étant donné que votre code html n'est pas foncièrement mauvais, il faut "juste" bien comprendre les CSS. Reprenez CSS débutant à partir de la home page http://css.mammouthland.net/
Sinon, il y a aussi le site du zéro https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3