28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je début dans le CSS. J'ai une page web qui contient du code style.

J'ai une image header.jpg je veux y mettre du texte mais le texte bouge suivant l'ecran et la resolution de la personne. J'aimerais savoir si il est possible de fixer le texte quelque soit la résolution d'écran du visiteur.

Merci pour votre aide à tous!
Modifié par byters (20 Apr 2007 - 13:24)
Bonsoir,

Tu ne peux pas fixer du texte avec du CSS.

Par contre tu peux le mettre dans l'image et créer un contenu alternatif à ton image Smiley cligne
a écrit :
J'ai une image header.jpg je veux y mettre du texte mais le texte bouge suivant l'ecran et la resolution de la personne.


Je ne parviens pas à comprendre ce que tu souhaites faire, aurais-tu un lien et/ou un screen de ce que veux faire?
Modérateur
Salut,

Super_baloo8 a écrit :
Tu ne peux pas fixer du texte avec du CSS.

Par contre tu peux le mettre dans l'image et créer un contenu alternatif à ton image


lol Smiley lol


<body>
   <div id="mon_bloc">
    <p>mon texte</p>
   </div>
</body>




#mon_bloc   { background-image: url("../mon_chemin/image.jpg"); background-repeat: no-repeat; background-position: center center; ; margin-left: 15 px; width: 700px }


Ceci est une manière parmis tant d'autres Smiley cligne
j'ai fait ce code de mémoire, peut être qu'il s'est glissé quelques erreurs de syntaxe.
++
Modifié par Nolem (20 Apr 2007 - 09:59)
Salut Nolem, en css il est impossible de fixer du texte. Même un texte en pixel changera suivant la configuration de l'utilisateur (zoom).

Pour simplifier ta css :

#mon_bloc { 
background: transparent url("../mon_chemin/image.jpg") center center no-repeat; 
margin-left: 15px; 
width: 700px;
}

Modifié par Super_baloo8 (20 Apr 2007 - 10:14)
Bonjour,

Je rajoute ma pierre à l'édifice : pourquoi insérer un paragraphe dans un <div> ?
Si tu ne comptes pas rajouter d'autre élément dans ce <div> je pense que le paragraphe devrait suffire ?
Modifié par Cygnus (20 Apr 2007 - 10:24)
Modérateur
Super_baloo8 a écrit :
Salut Nolem, en css il est impossible de fixer du texte. Même un texte en pixel changera suivant la configuration de l'utilisateur (zoom).



re,

Si tu insères un texte dans un bloc et que ce bloc tu lui donnes une largeur fixe (width :700 px) avec par exemple un alignement gauche, l'utilisateur aura beau changé de résolution, le texte ne bougera pas Smiley cligne

Cygnus a écrit :

Si tu ne comptes pas rajouter d'autre élément dans ce <div>, je pense que le paragraphe (qui est de type block), devrait suffire ?


Dans le fond, tu as raison, mais alors il faut spaner ce bloc (<span>)
et donner une dimension au span Smiley cligne

Sinon, je pense que cela doit être possible en class (<p class="mon_bloc">)

Si j'ai un peu de temps dans la journée, je regarde de plus près mon code, mais je suis pratiquement sûr que c'est juste Smiley smile

++
Modifié par Nolem (20 Apr 2007 - 10:36)
Tu pourrais faire :

<p id="bloc">Ton texte</p>


Et la css :

#bloc { 

background: transparent url("../mon_chemin/image.jpg") center center no-repeat; 

margin-left: 15px; 

width: 700px;

}


Oui ton texte ne bougera pas suivant les résolutions d'écran. Mais je parlais pour les zoom sur les texte, ce qui est hors sujet Smiley biggol
Modifié par Super_baloo8 (20 Apr 2007 - 10:41)
Nolem a écrit :
Dans le fond, tu as raison, mais alors il faut spaner ce bloc (<span>)
et donner une dimension au span Smiley cligne

Qu'entends-tu par là ? Smiley eek
Il suffit de donner une class ou un identifiant à ton paragraphe et le tour est joué...

Il me semble que tu as quelques incompréhension au niveau des différentes balises.
Je te conseille cet article qui est très bien écrit : La structure des balises : bloc et en-ligne Smiley cligne
Modérateur
re,

Oups, En effet, je me suis trompé sur le span (mea culpa).

Néanmoins, le div est juste et la class aussi. Juste pour info, je répond simplement à la question de byters. Juste pour lui donner quelques indications interressantes, n'est ce pas ?

a écrit :
J'ai une image header.jpg je veux y mettre du texte mais le texte bouge suivant l'ecran et la resolution de la personne. J'aimerais savoir si il est possible de fixer le texte quelque soit la résolution d'écran du visiteur.


Pour finir : <p id="bloc">Ton texte</p> cela revient à dire : <p class="bloc">Ton texte</p>.



.bloc {color: white; background-color : #369 ; width:200px; height:200px}



De mon côté je préfère rajouter un div pour mieux travailler la mise au point du texte sans utiliser les padding Smiley cligne . Je sais que les div en série ne sont pas très bons et donc je m'arrange pour ne pas en mettre trop. Smiley cligne . D'ailleurs, si le texte n'est qu'une phrase simple, j'utiliserai la class.

++
Modifié par Nolem (20 Apr 2007 - 11:26)