28172 sujets

CSS et mise en forme, CSS3

Texte sur une image

Bonjour , je ne sais pas si c'est ici que je dois poster ma question ( désolée si je me suis trompée = > je suis nouvelle ) .

En fait je suis entrain de travailler avec Dreamweaver pour créer un site web relativement simple. Et je dois placer un texte sur une image ( c'est une forme carrée aux coins arrondis collé à une feuille d'arbre stylisée le tout créé en photoshop) .
Le texte est en fait trois liens .
Je ne parviens pas à gérer cela dans ma feuille de style.

Pourriez-vous m'aider ?

Merci d'avance
Hello

Tu as quand même une base html a montrer ou un début de css? un screen au pire ?
parce que la ... y a juste 396 façons de faire ^^'
la base je dois la créer moi même , je pars de rien.
J'ai créé ma feuille de style et mon html moi même.

[IMG]http://www.monsterup.com/upload/1337691665700.jpg[/IMG]

voilà j'ai mit le lien de ma maquette brouillon.

Ce que je n'arrive pas a faire c'est le cadre vert en haut à gauche sous le header , où il y a "mon compte , contact , points de vente, FAQ "
Bonjour,

Merci de nous fournir le code que tu as actuellement. Nous pourrons t'aider à voir où tu es bloqué.
voilà mon code : il y a probablement des erreurs car je suis pas très douée en web , mais obligation scolaire oblige je dois me débrouiller ^^

<!DOCTYPE html>
<html lang="fr">



<head>
<meta charset="UTF-8">
<title>ecoverweb</title>
<link href="ecover.css" rel="stylesheet" type="text/css">
<title>ecoverweb</title>


<head>
<style type="text/css">
<!--
a {
text-decoration: none;
}
//
</style>
</head>
<body>

<div id="container">

<header>
<nav>
<ul id="menuhaut">
<li><a href="#">Home</a></li>
<li><a href="#">Partenaires</a></li>
<li><a href="#">Sitemap</a></li>
</ul>
</nav>

<img src="images/header.jpg" width="950" height="182" alt="header">
</header>


<aside></aside>

<!--code pour avoir la ligne sous l'image du header-->
<hr>
<ul id="headerBtn2">

<li>
<a id="btnCompteId" class="btnCompte" href="#" onclick="showLoginPopup(); return false;">Mon compte</a>
</li>
<li>
<a class="btnContact" accesskey="9" href="javascript:showContactInPopup();">Contactez-nous</a>
</li>
<li>
<a class="btnCompte" href="#" onclick="showParrainagePopup(); return false;">Points de vente</a>
</li>
<li>
<a class="btnCompte" href="#" onclick="showParrainagePopup(); return false;">FAQ</a>
</li>

<img src="images/carreplante.png" width="215" height="185" alt="carreplante">





<nav>
<ul>
<li><a href="#">Ecovertalk</a></li>
<li><a href="#">Historique</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Presse</a></li>
<li><a href="#">Nos produits</a></li>
</ul>
</nav>
<article>
<h3>Ecovertalk c'est:</h3>
<p></p>
<h3></h3>
<p></p>
</article>

<footer>@Ecover - Legal Disclaimer - Contact - Side by the Insiders</footer>
</div>

</body>
</html>
Ok,

l'idée c'est de mettre ton image en background (avec CSS) d'un élément (à priori un ul) qui sera parent de tes trois liens, placés dans des éléments de liste (li).

Avec CSS, tu pourras ensuite positionner ces éléments de listes (marges, paddings...)
ce que j'ai fait ici , j'ai importé mon image carré vert aux bords arrondi avec la "plante" et je ne parviens pas a superposer une zone texte .

J'ai pu lire votre réponse, mais j'ai un peu de mal a voir comment réaliser / former cela sur ma feuille css
Dans ce cas, je ne peux que te conseiller d'aller dans la section "Apprendre" et de lire les tutos d'initiation au positionnement en CSS. C'est la base, sans ça tu ne pourras pas faire ce que tu souhaites.
ok merci je vais voir ce que je peux trouver en rapport avec mon problème ...
merci quand même
youpiii j'ai compris ce que vous m'avez dit , il a juste fallu le temps que j'y réfléchisse...
j'ai juste du mal a bien placer mon texte qui est un lien a dans une liste li elle même dans une ul à laquelle j'ai donné un identifiant.

Merci
Sujet clos
Aller à