Rechercher : dans
Par :

Bannière,en-tête,menu dans Nvu

Dernière réponse le 12 jui 2008 à 18:55:07 Ninco, le 1 jun 2007 à 16:23:00 
 Signaler ce message aux modérateurs

Nouvel utilisateur de Nvu, j'aimerai créer une bordure où je mettrai des liens, faire une en-tête avec une image et créer une barre de menu avec des liens. J'ai vu des tuturiaux où il faut utiliser l'Editeur CSS, il dise de cliquer sur "Feuille incorporée"mais moi a la la place il a "Nouveau groupe" et si je clique sur l'onglet bordure sa ne marche pas; de plus la partie Général est en anglais alors que je suis en version française et dans les tutoriaux que j'ai vu cette partie était en français.Cela vient il de la version de Nvu(trop veille où l'inverse)? J'aimerais faire tout cela dans Nvu si possible en tapant le moins possible de code HTML; mais si c'est indispasable je prends tout ce qui pourrait mettre utile.

Merci

Configuration: Windows XP
Internet Explorer 6.0

Meilleures réponses pour « Bannière,en tête,menu dans Nvu » dans :
Comment créer une carte de menu de Noël VoirQuoi de plus "fashion" que de présenter une carte/un carton de menu de Noël ! Sympa, élégant, rigolo aussi, c'est selon ! Voici une petite astuce qui vous guidera dans votre création et... votre créativité ! Sommaire Choisir le menu de...
Réorganiser le menu Démarrer VoirAu fur et à mesure des diverses installations, le "Menu Démarrer" devient de plus en plus rempli et très mal organisé. Voilà comment procéder pour obtenir un menu organisé. Accéder au menu Démarrer Sous Vista, ce fichier est caché donc il faut...
[Vista] Afficher la commande Exécuter du menu Démarrer VoirAfficher la commande "Exécuter" du menu Démarrer Lors de l'acquisition de votre nouveau système d'exploitation Vista, vous vous apercevrez que la commande "Exécuter", qui est assez coutumière et serviable chez son petit frère XP, n'existe...
Télécharger NVU VoirNVU est un éditeur HTML WYSIWIG (What You See Is What You Get) libre, c'est-à-dire un logiciel permettant de créer visuellement des pages HTML à l'aide d'une interface graphique. A ce titre, NVU représente une alternative libre aux éditeurs HTML...
Windows 7 - Barre des tâches et menu démarrer VoirLA BARRE DES TACHES ET LE MENU DEMARRER Cet élément clé du Bureau de Windows est situé en bas de l’écran, sur toute sa largeur. C’est l’un des aspects du système qui a le plus évolué entre Windows Vista et Windows 7. Pour commencer, elle est plus...
PHP - Les cookies et les en-têtes HTTP VoirLes en-têtes HTTP Lors de chaque échange par le protocole HTTP entre votre navigateur et le serveur, des données dîtes d'en-têtes contenant des informations sur les données à envoyer (dans le cas d'une requête) ou envoyées (dans le cas d'une...

1

king, le 1 jun 2007 à 19:50:24

L'incorporer n'a guère d'intérêt.
Tu fais un css externe que tu rapelles dans ta page.

Le plus simple est un div conteneur (donc tout ton site) dans lequel tu fais apparaître un div header, un div menu, un div contenu et (si nécessaire) un div footer.

ou tu peux faire plusieurs div contenu, si il te faut plusieures colonnes.

Nvu lit les fichiers externes (enfin les CSS car javascript, c'est pas gagné).

Répondre à king

2

Ninco, le 1 jun 2007 à 20:01:36

Merci pour ta réponse king, mais le langage html ça pas trop mon truc, j'ai du mal à placer les conteneurs,de plus pour ma bordure je voudrais choisir sa taille, sa couleur(où mettre une image, un dégrader par expl) et la placer où je veut. Mon problème c'est l'Editeur CSS.

merci

Répondre à Ninco

3

Gihef, le 1 jun 2007 à 21:00:43

Bonjour,

Le problème c'est que l'éditeur ne te sera pas d'un grand secours si tu ne connais rien aux CSS.
Après avoir donné un nom à ton style, il te faut indiquer à Nvu ce qu'il doit faire, choisir des options, les modifier… Et appliquer ton style à l'élément html concerné.
Les tutoriaux doivent certainement donner des exemples du code que l'éditeur produit. Tu peux t'en servir pour créer tes styles à la main et indiquer le lien vers cette feuille dans le code de ta page (sans Nvu).

Tu ne disposes peut-être pas des options de la documentation parce que tu es ou n'es pas dans le mode Expert ?

Si tu as des infos précises à nous donner (image, taille, texte…) nous pouvons t'aider à créer ta feuille de style et à l'appliquer à ta page.

+ Il n'est pas inutile de mettre les doigts dans le code pour réaliser précisément ce qu'on veut.
 

Répondre à Gihef

4

Ninco, le 1 jun 2007 à 21:30:20

Merci Gihef,si c' est inutile de mettre les doigts dans le code html
pourrait tu m'aidé pas à pas; le truc c'est que voudrais faire un site classique. D'abord une Grande image qui fait le largeur de mon site
(en-tête) puis en dessus une barre menu que je voudrais personnaliser(maitre une image crée par ex un dégradé et sur le coté droit une bordure avec des liens que voudrais personnaliser.

Merci d'avance

Répondre à Ninco

5

tonnick, le 2 jun 2007 à 10:45:20

Salut

qd tu maitrises un peu le CSS, c'est tres simple. regarde ici : http://layouts.ironmyers.com/ tu as des gabarits interressants.
Tu regardes comment c'est fait et tu apprends :) pour débuter c'est pratique. Ensuite viennent les balises un peu plus complexe de mise en page de ton texte. Ce sera la seconde étape

Répondre à tonnick

6

Gihef, le 2 jun 2007 à 15:47:45

Je ne suis pas sûr d'avoir bien compris tes explications.
Je te propose quand même de regarder cet exemple assez simple que tu pourras modifier et insérer dans le code de ta page.

On peut ajouter ces gabarits avec menu.
 

Répondre à Gihef

9

loleq, le 11 jan 2008 à 18:44:32

Bonjour Gihef,

Je souhaite créer un menu vertical sur la gauche de mes pages web. J'ai consulté les codes source de tes gabarits, et j'ai réussi à faire une mise en page comme je le souhaitais. Je me suis inspirée de ce modèle : http://css.alsacreations.com/modeles/modele3.htm en ne concervant que la partie de gauche et centrale. Ca donne cela : http://vaunage-passion-velos.fr/temp.html.

Sur la phrase "partie centrale qui "pousse" les colonnes vers le bas" que signifie "qui "pousse" les colonnes vers le bas" ? Je pensais que ça signifiait que lorsque l'on fait dérouler la page vers le bas, la colonne de gauche suit le mouvement et reste dans la fenêtre. N'est-ce pas cela ?

Répondre à loleq

10

Gihef, le 12 jan 2008 à 13:30:22

Bonjour,

Je vois à peu près de quoi ça parle, mais où trouves-tu "partie centrale qui "pousse" les colonnes vers le bas" ?

--

Répondre à Gihef

7

ninco, le 3 jun 2007 à 14:07:53

Merci pour la peine que tu t'est donne Gihef, mais je suis vraiment débutant, je ne sais pas où plaçer les balises <a>, si possible pourrait tu me donné le code html et je remplacerai le tout avec mes propres images? (c'est compliquer que ça à faire surtout dans Nvu ?)

Merci pour tout

Répondre à ninco

8

Gihef, le 3 jun 2007 à 23:42:00
  • +2

Le code HTML, je n'ai as besoin de te le donner. Tu as la page, tu as le code.
Il te suffit d'“Afficher le code source” (clic droit) ou mieux, d'“Enregistrer sous… — Format HTML” la page sur ton disque dur.

Les balises <a> sont générées par Nvu lorsque tu crées un lien (Insertion — Lien).
Un lien est sous la forme :

<a href="adresse_de_le_page.html">Le texte sur lequel on clique</a>

Par exemple.
Une page vierge créée par Nvu.
La même après un peu de ménage.
La même après insertion de l'en-tête.

Enregistre les pages. Compare-les.
 

Répondre à Gihef

11

loleq, le 12 jan 2008 à 15:00:00

La "partie centrale qui "pousse" les colonnes vers le bas" c'est ce qu'il y a écrit sur le modèle : http://css.alsacreations.com/modeles/modele3.htm

Répondre à loleq

12

Gihef, le 12 jan 2008 à 15:31:56

Ah, oui.

Non, ça signifie simplement que le pied de page est repoussé vers le bas au fur et à mesure que la <div id="centre"> se remplit.
Ce qu'on peut vérifier assez facilement

<!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>
<title>Largeur fixe 750, header/menu gauche/contenu/footer.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
}
#header {
height: 100px;
background-color: #99CCCC;
}
#conteneur {
position: relative;
width: 750px;
margin: 0 auto; 
background-color:#CCCCFF;
}
#centre {
background-color:#9999CC;
margin-left: 150px;
}
#gauche {
position: absolute;
left:0;
width: 150px;
background-color: #cc9999;
}
#pied {
height: 30px;
background-color: #99CC99;
}
.menugauche {
list-style-type: none;
margin: 0;
padding:0;
}
.menugauche li {
margin-bottom: 5px;
}
.menugauche a {
margin: 0 2px;
color: #000000;
text-decoration: underline;
}
.menugauche a:hover {
text-decoration: none;
}
p {margin: 0 0 10px 0;}
</style>
</head>
<body>
<div id="conteneur">
    <div id="header">header de largeur fixe : 750px <a href="http://css.alsacreations.com/Modeles-de-mise-en-page-en-CSS">(voir tous les modèles)</a>
</div>
    <div id="gauche">
      <p>menu</p>
      <p>largeur fixe : 150px</p>
        <ul class="menugauche">
          <li><a href="">Menu 1</a></li>
          <li><a href="">Menu 2</a></li>
          <li><a href="">Menu 3</a></li>
          <li><a href="">Menu 4</a></li>
        </ul>
    </div>
    <div id="centre">
      partie centrale qui &quot;pousse&quot; les colonnes vers le bas.<br />
    </div>
    <div id="pied">pied de page de largeur fixe : 750px </div>
</div>
</body>
</html>
Ou avec un autre exemple.

Le contexte de l'exemple est différent du tien. La structure est moins “libre”, plus claire.
Les éléments de la page sont placés dans une <div id="conteneur"> qui définit des dimensions et la position de l'ensemble sur la page.

--

Répondre à Gihef

13

 pertubado, le 12 jui 2008 à 18:55:07

"sur la phrase "partie centrale qui "pousse" les colonnes vers le bas" que signifie "qui "pousse" les colonnes vers le bas" ? Je pensais que ça signifiait que lorsque l'on fait dérouler la page vers le bas, la colonne de gauche suit le mouvement et reste dans la fenêtre. N'est-ce pas cela ?"

Bonjour à tous !
je suis moi aussi un débutant et ce topic m'a jusqu'à maintenant été très utile.


J'ai relevé la phrase ci-avant parce qu'en fait c'est exactement ce que je veux faire : un menu mouvant toujours à portée de souris.

pouvez-vous m'aider ??

Répondre à pertubado
Collection CommentÇaMarche.net