[Help] Grand amateur que je suis ! :roll:

Discussion dans 'Web, design' créé par chaudard, 31 Mars 2007.

Statut de la discussion:
Fermée.
  1. Offline
    chaudard Sergent Chef :::::
    Salut,

    Ben voilà ça fait 2 heures que j'essaie avec Dreamweaver (soit c'est les vapeurs de hier soit je suis vraiment le roi des amateurs) mais je ne parviens pas à centrer une image et lui mettre un liens, et un background en "mosaïque"...

    En fait je suis entrain de refaire tout doucement le site web de mes beau-parents, il y a déjà une vieille version que j'ai envie de changer... j'ai créer un "index" avec les "new" design et j'aimerais y mettre un lien vers l'ancien (index2.html) qui sera dans le même dossier et un mailto sur leur new email...

    Si quelqu'un à une astuces ou ce sent charitable en ce jour... qu'il me fasse sign ! ;)

    Pour les interessés:

    [IMG]
    chaudard, 31 Mars 2007
    #1
  2. Offline
    FissaA Dayz Nood Player
    C'est pas mal, mais fait plus ressortir le texte " Auberge du carrefour ". rouge sur rouge c'est pas asser lisible ( je trouve )

    Une petite lueur externer ? :)
    FissaA, 31 Mars 2007
    #2
  3. Offline
    guslinux Gamerz'ien
    pas mal la page :p si tu veux j'peux te donner un coup de main :-D
    guslinux, 1 Avril 2007
    #3
  4. Offline
    Onefive Freddy Tougaux
    je crois que c'est pas sa question...

    Et chaudard je t'avouerai pas trop avoir compris ce que tu veux, c'est p-e l'heure qui fait ca. Si tu pouvais re-expliquer ou quoi :)
    Onefive, 1 Avril 2007
    #4
  5. Offline
    SeigVoland Elite
    Une idée faite rapidement:

    parti css:


    body {
    background-image: url("mosaic.png");
    background-repeat: repeat;
    }

    div#image-background {
    background-image: url("image-back.png");
    background-repeat: no-repeat;
    position:absolute;
    left: 50%;
    top: 50%;
    margin-left: -258px;
    margin-top: -343px;
    border: 0px;
    width: 516px;
    height: 687px;
    padding: 0;
    }

    partie html

    <html>

    <head>

    <title>test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <meta http-equiv="Content-Language" content="fr" />
    <style type="text/css" media="screen">@import "test.css";</style>

    </head>


    <body>

    <div id="image-background">



    </div>

    </body>

    </html>



    Dans le css: tu remplaces mosaic.png par le nom de ta mosaic, image-back.png par ton background, width et heigth, par la largeur et hauteur de ton background, margin-left et margin-top par la moitié respectivement de la largeur et de la hauteur du background

    Dans le html tu remplaces le test.css par le nom de ta feuille de style.

    Normalement ça marche nickel même si ce n'est sûrement pas optimisé =].
    SeigVoland, 1 Avril 2007
    #5
  6. Offline
    chaudard Sergent Chef :::::
    Merci je vais essayer ça tout à l'heure...


    Onefive:

    [IMG]

    C'est à ça que je veux arriver, mais le blem c que je ne comprend rien et bidouille pas des masses ds l'html, css,...

    Je vais essayer le code donné et je dirais quoi !


    Merci
    chaudard, 1 Avril 2007
    #6
  7. Offline
    SeigVoland Elite
    Essaie ce que je t'ai filé et si tu veux des modifs, je t'aiderais =].

    ps: Par background j'entends bien l'image que tu veux centrer.
    SeigVoland, 1 Avril 2007
    #7
  8. Offline
    chaudard Sergent Chef :::::
    Salut,

    Voilà j'ai fait suivant ton cade, et ça marcheee :-D , juste que je n'ai pas bien optimisé mon fond en png (250ko) sinon le reste ça va...
    TESTl


    Maintenant, autre problème, je ne parviens pas a mettre des liens hypertexte je ne trouve pas d'outils "plume" où je pourrais créer une zone et y définir un lien ! quelqu'un pourraient m'éclairer dans dreamweaver 8 ?
    chaudard, 3 Avril 2007
    #8
  9. Offline
    chaudard Sergent Chef :::::
    Si quelqu'un pourrait aussi m'aider à créer une signature que j'utiliserais dans Thunderbird ou autre soft de messagerie...

    J'aimerais y insérer une image (banderole) avec liens web, mails,...


    Merci
    chaudard, 3 Avril 2007
    #9
  10. Offline
    SeigVoland Elite
    Salut .

    Pour faire des zones cliquables:

    Partie html:

    <html:colere:head:colere:title>test</title>




    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Language" content="fr">
    <style type="text/css" media="screen">@import "index.css";</style:colere:/head:colere:body linkifymax="0" linkifycurrent="0" linkifying="true">

    <div id="image-background">

    <map name="zone-page-acceuil">
    <area shape="rect" coords="187,317,308,326" href="http://www.google.be:fr">
    <area shape="poly" coords="202,381,291,381,291,399,333,399,333,416,153,416,153,399,202,399" href="http://www.yahoo.fr"> </map>
    <img src="http://www.aubergeducarrefour.be/index2007.png" usemap="#zone-page-acceuil">

    </div>

    </body:colere:/html>

    Partie css:

    body {
    background-image: url("fond.gif");
    background-repeat: repeat;
    }

    div#image-background {
    background-image: url("index2007.png");
    background-repeat: no-repeat;
    position:absolute;
    left: 50%;
    top: 50%;
    margin-left: -258px;
    margin-top: -343px;
    border: 0px;
    width: 480px;
    height: 616px;
    padding: 0;
    }

    img {
    border:none;
    }


    Je n'ai fais que 2 zones mais tu peux facilement en rajouter. Le "zone-map-accueil" tu choisis ce que tu veux. Le area shape, il y en a 3: "rect" pour rectangle, "poly" pour polynome et "circle" pour un cercle.

    Pour rectangle, tu indiques les coordonnées du point supérieur gauche (x1,y1) et du point inférieur droit (x2,y2) ce qui donne (x1,y1,x2,y2).

    Pour polynome tu donnes point par point comme si tu dessinais le polynome (x1,y1,x2,y2,...,xn,yn).

    Pour le cercle tu détermines le centre et le rayon (x1,y1,r)

    Ensuite tu modifies les liens vers lesquels la partie d'image pointe.

    Pour le css, j'ai rajouté

    img {
    border:none;
    }

    pour ne pas avoir de bords bleus autour de tes liens.

    N'hésite pas à demander si tu as des questions .
    SeigVoland, 3 Avril 2007
    #10
  11. Offline
    chaudard Sergent Chef :::::
    .... là, je suis complètement perdu ! :roll:

    Peux tu peux être me dire comment faire via dreamweaver, pas de code !?!

    Peux-tu m'aider aussi à faire une signature mail?
    chaudard, 4 Avril 2007
    #11
  12. Offline
    SeigVoland Elite
    Par dreamweaver, je ne connais pas de trop. J'ai ce programme mais le code écrit tout bêtement avec notepad est bien plus léger et facile à relire. J'avais vu sur un site qui comparait 2 programmes et notepad que dreamweaver était de loin le code le plus lourd.

    Il te suffit d'intégrer les morceaux de code dans ta page, tu l'édit simplement avec le notepad et tu mets le code à la place voulue =].

    Pour la signature, je ne suis pas un expert de photoshop etc. J'arrive à faire des trucs mais il y a beaucoup de personnes sur ce forum bien plus douées que moi.
    SeigVoland, 4 Avril 2007
    #12
  13. Offline
    hoshi Hoshi's Love
    Si tu veux cible une endroit de ta pas tu fait un calque qui donne une destination vers ta page web je sais ca donne pas un beau code mais bon si tu vexu pas rentrer dans les détails de l'htmlc le seul moyen et tu veux dire koi par signature mail?
    hoshi, 6 Avril 2007
    #13
Statut de la discussion:
Fermée.