Merci beaucoup Christele ca a l'air de fonctionner.
Cependant comme on me le conseil je commence par les html pour la suite je verais.
Je me permet de vous poster ma page about me afin que vous me disiez (si ca ne vous dérange pas) si vous voyez de graves fautes de code (qui me rendraient la tache difficile une fois devant mon css) ou si ca vous parrait correct.
<!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" >
<head>
<title>||| Vincent Bruneau ||| Advertising designer |||</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!--<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />-->
</head>
<!---------------------Banner--------------->
<body bgcolor="#926dac" topmargin="0">
<div id="banner">
<img src="images/banner.jpg" alt="Vincent Bruneau || Advertising designer" align=top>
</div>
<div id="desk">
<img src="images/buttons_desk.jpg" align=top>
</div>
<!------------------------------------------>
<!--------------------Links----------------->
<div id="bbh">
<a href="about.htm" class="abm">about me</a>
<a href="portfolio.htm" class="pfol">portfolio</a>
<a href="contact.htm" class="contact">contact</a>
</div>
<!------------------------------------------>
<!-------------------contenu---------------->
<div id="corp">
<font face="arial" color=white size=2><h3>Bienvenue sur mon portfolio</h3><p align="justify">
<br>
Mon nom est Vincent Bruneau je suis graphiste publicitaire et je suis ravi de vous accueillir sur mon "personal portfolio".<br/><br/>
Après l'obtention d'un <i>bac professionnel communication graphique</i>, je me suis lancé
dans l'entrepreneuriat avec quelques amis ingénieurs. Notre projet s'articulait autour du marché
de l'électronique grand public, avec comme figure de proue un cadre communiquant, proposant aux utilisateurs
une interface tactile ouverte sur le web.<br/>
Au sein de ce projet, j'ai été en charge de l'identité de la marque et du produit. Création de chartes graphiques
(logos, elemet graphiques, polices d'écritures, etc.), conception et création d'une interface graphique, conception
de la vue artistique du design produit, création de packaging, réalisation de clip publicitaire, et bien d'autres
expériences qui sont venues enrichir mes connaissances professionnelles et mes compétences de travail au sein d'une équipe.<br/><br/>
Je vous invite à visiter mon book en cliquant sur le bouton <a href="portfolio.htm">"portfolio"</a> et vous souhaite une agréable visite.</font></p>
</div>
<!------------------------------------------->
<!------------------Footer------------------->
<div id="footer">
<p class="copyright"><font face="arial" color=white size=1>©2009 Vincent Bruneau<br/><br/><br/><br/>Suivez vincent bruneau sur :</p>
</div>
</body>
</html>
Edit : voici donc ce que cela donne avec la méthode de Christele (merci ^^),
donc en mettant mes boutons dans le div "desk"
htm :
<!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" >
<head>
<title>||| Vincent Bruneau ||| Advertising designer |||</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
</head>
<!---------------------Banner--------------->
<body bgcolor="#926dac" topmargin="0">
<div id="banner">
<img src="images/banner.jpg" alt="Vincent Bruneau || Advertising designer" align=top>
</div>
<!------------------------------------------>
<!--------------------Links----------------->
<div id="desk">
<span class="abm"><a href="about.htm"></a></span>
<span class="pfol"><a href="portfolio.htm"></a></span>
<span class="contact"><a href="contact.htm"></a></span>
</div>
<!------------------------------------------>
<!-------------------contenu---------------->
<div id="corp">
<font face="arial" color=white size=2><h3>Bienvenue sur mon portfolio</h3><p align="justify">
<br>
Mon nom est Vincent Bruneau je suis graphiste publicitaire et je suis ravi de vous accueillir sur mon "personal portfolio".<br/><br/>
Après l'obtention d'un <i>bac professionnel communication graphique</i>, je me suis lancé
dans l'entrepreneuriat avec quelques amis ingénieurs. Notre projet s'articulait autour du marché
de l'électronique grand public, avec comme figure de proue un cadre communiquant, proposant aux utilisateurs
une interface tactile ouverte sur le web.<br/>
Au sein de ce projet, j'ai été en charge de l'identité de la marque et du produit. Création de chartes graphiques
(logos, elemet graphiques, polices d'écritures, etc.), conception et création d'une interface graphique, conception
de la vue artistique du design produit, création de packaging, réalisation de clip publicitaire, et bien d'autres
expériences qui sont venues enrichir mes connaissances professionnelles et mes compétences de travail au sein d'une équipe.<br/><br/>
Je vous invite à visiter mon book en cliquant sur le bouton <a href="portfolio.htm">"portfolio"</a> et vous souhaite une agréable visite.</font></p>
</div>
<!------------------------------------------->
<!------------------Footer------------------->
<div id="footer">
<p class="copyright"><font face="arial" color=white size=1>©2009 Vincent Bruneau<br/><br/><br/><br/>Suivez vincent bruneau sur :</p>
</div>
<div id="logo">
<a href="#"><img span="in" src="images/in.png"></a>
<a href="#"><img span="da" src="images/da.png"></a>
<a href="#"><img span="go" src="images/go.png"></a>
</div>
</body>
</html>
et le css
body
{
width: 1024px;
margin: auto;
}
a img
{
border: none;
}
/* ----------------------------------- */
/* ---------------BANNER ------------- */
/* ----------------------------------- */
#banner
{
Width: 1024px;
Height: 212px;
margin: no-margin;
background-repeat: no-repeat;
}
/* ----------------------------------- */
/* ------------- BUTTONS --------------- */
/* ----------------------------------- */
#desk
{
float: left;
Width: 514px;
Height: 43px;
background-image: url("images/buttons_desk.jpg");
background-repeat: no-repeat;
}
.abm
{
margin-left: 514px;
background-image: url("images/abm_hover.gif");
background-repeat: no-repeat;
width: 87px;
height: 43px;
}
.abm a
{
margin-left: 514px;
background-image: url("images/abm_stand.gif");
background-repeat: no-repeat;
width: 87px;
height: 43px;
display: block;
}
.abm a:hover
{
margin-left: 514px;
background: none;
}
.pfol
{
margin-left: 601px;
background-image: url("images/pfol_hover.gif");
background-repeat: no-repeat;
width: 87px;
height: 43px;
}
.pfol a
{
margin-left: 601px;
background-image: url("images/pfol_stand.gif");
background-repeat: no-repeat;
width: 87px;
height: 43px;
display: block;
}
.pfol a:hover
{
margin-left: 601px;
background: none;
}
/* ----------------------------------- */
/* -------------------- BODY ------------------- */
/* ----------------------------------- */
#corp
{
width: 862px;
height: 500px;
background-image: url("images/body.jpg");
background-repeat: repeat-y;
}
h3
{
margin-left: 200px;
margin-top: 60px;
}
p
{
margin-left: 200px;
margin-right: 40px;
}
p a
{
color: white;
}
Voila donc ou j'en suis. Mais 2 nouveaux probleme se présentent devant moi
1 - comment faire pour mettre en texte brute (genre "alt") le contenue de mes boutons ?
2 - pourquoi le bouton contenu dans ma class "pfol" ne s'affiche pas du tout sur mon appercu ?
Voila d'avance merci et bonne soirée à tous
Modifié par ptitvincent (02 Dec 2009 - 18:45)
)
