Gimp et Nvu

kubo · Message par **kubo** » 16 mai 2007, 14:16

Bonjours

Alors voila j'ai réalisé une de mes première maquette mais je suis totalement perdu pour l'associé a un code html

j'ai eu beau chercher sur internet je ne trouve rien

voila en gros l'index :
http://img392.imageshack.us/my.php?image=accueilcw2.png

je n'ai pas de problème pour faire la découpe avec gimp par contre je n'arrive pas du tout a restituer avec nvu et je ne sais pas comment faire les liens surtout que la barre de navigation change quand on clic dessus

voila des exemples

je n'ai pas tout mis je pense que vous avez compri

faut-il faire une iframe ?
je pense qu'il en faudra une pour que le text s'affiche dans le cadre mais pour les boutons je ne sais pas

merci a tous et surtout merci a la maison mozilla et au autre d'etre libre et gartuit

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

Message par **chinon37** » 16 mai 2007, 14:34

Nvu ou mieux, Kompozer, ne permet pas la découpe d'une image. Tu dois faire la découpe dans The Gimp et ensuite mettre les images découpées dans les conteneurs génériques (<div>) adéquats.

Déjà un petit tour sur cette page:
http://css.alsacreations.com/Modeles-de ... age-en-CSS
devrait permettre de dégrossir ce que tu souhaites.

kubo · Message par **kubo** » 16 mai 2007, 14:56

merci

Alors au début aucun problème (j'utilise l'éditeur css de nvu)
j'arrive meme a faire un corps extenssible ^^

le seul problème c'est le menu, pour mettre les "boutons" du menu les uns a coté des autre et faire des liens
je n'arrive pas je n'arrive a mettre que des morceaux l'est uns en dessous des autres

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

Message par **chinon37** » 16 mai 2007, 15:54

pour le menu, une simple liste avec le css suivant:

Code : Tout sélectionner

ul {
list-style-type: none;
}
li {
display: inline;
padding-left: 10px;
}

tu le complètes pour <li> avec ton image en fond et des dimensions pour que les boutons soient tous de même taille

kubo · Message par **kubo** » 16 mai 2007, 20:58

je refait appelle a vous ca je suis perdu je n'avance pas je recule même

j'ai découpé ma maquette mais je n'arrive vraiment pas a la reconstitué

je n'ai aucune base en XHTML/CSS
je n'utilise que le graphique de nvu

aidez moi svp

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

Message par **chinon37** » 16 mai 2007, 22:10

là, il se fait tard!
Il faudrait au minimum attendre demain,... mais en plus c'est férié!

Invité · Message par **Invité** » 16 mai 2007, 22:15

en fait c'est bon il me reste juste un problèmes

comment je fait pour que mon graphique est toujours le meme aspect en fontion de la resolution et surtout sans barre de défilement

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

kubo · Message par **kubo** » 20 mai 2007, 00:32

En fait non c'est pas bon j'arrive pas avec le menu a faire des lien
est-il possible de faire un lien avec un bloc div ?

sinon pour la resolution c'est bon

merci

Message envoyé avec : Opera/9.20 (X11; Linux i686; U; en)

Message par **Ymai** » 20 mai 2007, 07:56

On peut avoir une idée de l'état actuel du chantier?
De péférence une adresse où se trouverait déjà le site web en construction; à défaut, le code HTML déjà écrit.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3

kubo · Message par **kubo** » 22 mai 2007, 22:50

voila j'ai résolu le problème

mais il m'en reste un les compatibilités avec IE

il y a de gros problème de décalage

mais pas de probleme avec les autres navigateurs

voila les codes
html :

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title>index</title>
  <link title="defaut" media="all" rel="stylesheet"
 href="style.css" type="text/css">
</head>
<body
 style="background-color: rgb(65, 74, 86); color: rgb(0, 0, 0); height: 43px;"
 alink="#000088" link="#0000ff" vlink="#ff0000">
<div class="entete"></div>
<div class="menu"></div>
<div class="menu1"><img
 style="width: 84px; height: 27px;" alt=""
 src="image/boutons/anaInact.png"><br>
</div>
<div class="menu2"></div>
<div class="menu3"><img
 style="width: 80px; height: 27px;" alt=""
 src="image/boutons/accueilAct.png"><br>
</div>
<div class="menu4"></div>
<div class="menu5"><img
 style="width: 167px; height: 27px;" alt=""
 src="image/boutons/telechargementInact.png"><br>
</div>
<div class="menu6"></div>
<div class="menu7"><img
 style="width: 116px; height: 27px;" alt=""
 src="image/boutons/multimediaInact.png"><br>
</div>
<div class="menu8"></div>
<div class="menu9"><img
 style="width: 216px; height: 27px;" alt="contact"
 src="image/boutons/conatactInact.png"><br>
</div>
<div class="menu10"></div>
<div class="entredeux1"></div>
<div style="font-family: Rehan;" class="corpsg"><br
 style="font-family: Samanata;">
</div>
<div class="corpsc"><span
 style="color: rgb(255, 255, 255); font-family: Samanata;">&nbsp;<br>
</span><span
 style="color: rgb(255, 255, 255); font-family: Samanata;"></span><span
 style="color: rgb(255, 255, 255); font-family: Samanata;"></span><span
 style="color: rgb(255, 255, 255); font-family: Samanata;"></span></div>
<div class="corpsd"><br>
</div>
<div class="fcorps"><br>
<br>
<span style="color: rgb(255, 255, 255); font-family: Samanata;"><br>
</span></div>
<div class="entredeux2"></div>
<div
 style="color: rgb(255, 255, 255); font-family: AR PL ShanHeiSun Uni;"
 class="footerg"><br>
</div>
<div class="footerc"><small><span
 style="color: rgb(255, 255, 255); font-family: AR PL ShanHeiSun Uni;"><br>
</span></small>
</div>
<div class="footerd"><br>
</div>
<div class="bas"></div>
</body>
</html>

et le css

Code : Tout sélectionner

/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */

  body { margin: auto;
    width: 770px;
    }

  .entete { background-repeat: no-repeat;
    background-image: url("image/accueil/accueil-0-0.png");
    height: 12px;
    }

  .menu { background-image: url("image/accueil/accueil-0-1-00-00.png");
    float: left;
    width: 42px;
    height: 27px;
    }

  .menu1 { background-image: url("image/accueil/accueil-0-1-01-00.png");
    float: left;
    width: 84px;
    height: 27px;
    }

  .menu2 { background-image: url("image/accueil/accueil-0-1-02-00.png");
    float: left;
    width: 4px;
    height: 27px;
    }

  .menu3 { background-image: url("image/accueil/accueil-0-1-03-00.png");
    width: 80px;
    float: left;
    height: 27px;
    }

  .menu4 { background-image: url("image/accueil/accueil-0-1-04-00.png");
    float: left;
    width: 4px;
    height: 27px;
    }

  .menu5 { background-image: url("image/accueil/accueil-0-1-05-00.png");
    float: left;
    width: 167px;
    height: 27px;
    }

  .menu6 { background-image: url("image/accueil/accueil-0-1-06-00.png");
    float: left;
    width: 3px;
    height: 27px;
    }

  .menu7 { background-image: url("image/accueil/accueil-0-1-07-00.png");
    float: left;
    width: 116px;
    height: 27px;
    }

  .menu8 { background-image: url("image/accueil/accueil-0-1-08-00.png");
    float: left;
    height: 27px;
    width: 1px;
    }

  .menu9 { background-image: url("image/accueil/accueil-0-1-09-00.png");
    float: left;
    height: 27px;
    width: 217px;
    }

  .menu10 { background-image: url("image/accueil/accueil-0-1-10-00.png");
    float: left;
    height: 27px;
    width: 52px;
    }

  .entredeux1 { background-repeat: no-repeat;
    background-image: url("image/accueil/accueil-0-2.png");
    height: 16px;
    margin-top: 27px;
    }

  .corpsg { background-image: url("image/accueil/accueil-0-3-0-0.png");
    width: 24px;
    float: left;
    background-repeat: repeat-y;
    }

  .corpsc { background-image: url("image/accueil/accueil-0-3-1-0.png");
    width: 724px;
    float: left;
    background-repeat: repeat-y;
    }

  .corpsd { background-image: url("image/accueil/accueil-0-3-2-0.png");
    width: 22px;
    background-repeat: repeat-y;
    margin-left: 748px;
    }

  .fcorps { background-image: url("image/accueil/accueil-0-4-0-0.png");
    background-repeat: no-repeat;
    background-position: left top;
    height: 81px;
    }

  .entredeux2 { background-image: url("image/accueil/accueil-0-4-0-1.png");
    background-repeat: no-repeat;
    background-position: left top;
    height: 79px;
    }

  .footerg { background-image: url("image/accueil/accueil-0-5-0-0.png");
    width: 24px;
    background-repeat: repeat-y;
    float: left;
    }

  .footerc { background-image: url("image/accueil/accueil-0-5-1-0.png");
    width: 724px;
    background-repeat: repeat-y;
    float: left;
    height: 19px;
    }

  .footerd { background-image: url("image/accueil/accueil-0-5-2-0.png");
    width: 22px;
    background-repeat: repeat-y;
    margin-left: 748px;
    }

  .bas { background-image: url("image/accueil/accueil-0-6.png");
    background-repeat: no-repeat;
    height: 29px;
    }

vous devriez trouver le site a l'adresse http://syllams.ath.cx

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

Invité · Message par **Invité** » 23 mai 2007, 19:57

up

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

kubo · Message par **kubo** » 25 mai 2007, 20:55

up

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

[modo]Rapport avec NVU/KompoZer ténu. Déplacé vers "Développement web"[/modo]

calimo · Message par **calimo** » 27 mai 2007, 10:36

kubo a écrit :mais il m'en reste un les compatibilités avec IE

http://dean.edwards.name/IE7/

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.3) Gecko/20061201 Firefox Firefox/2.0.0.3 (Ubuntu-feisty)

kubo · Message par **kubo** » 27 mai 2007, 21:58

merci mais j'ai beau chercher je crois qu'il me faudrai des explications

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20060601 Firefox/2.0.0.3 (Ubuntu-edgy)

calimo · Message par **calimo** » 28 mai 2007, 09:57

En gros si tu installes les scripts IE7 sur tes pages, tu as de fortes chances que les comportements bizarres d'IE6 disparaissent (pas tous évidemment, mais IE6 respectera beaucoup mieux les standards, sur certaines choses même mieux que Firefox !)

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.3) Gecko/20061201 Firerenard Firefox/2.0.0.3 (Ubuntu-feisty)

Geckozone

Gimp et Nvu

Gimp et Nvu

Qui est en ligne ?