Tutoriels vidéo art graphique gratuits

 
Bienvenue, Invité. Merci de vous connecter ou de vous inscrire.
Pages: [1]   En bas

Auteur Sujet: Mise en place d'un texte masqué ?  (Lu 3193 fois)

Sam Moss

  • Wisi Addict
  • ***
  • Hors ligne Hors ligne
  • Messages: 201
    • Voir le profil
Mise en place d'un texte masqué ?
« le: octobre 06, 2009, 10:02:23 am »

Bonjour,

Quel est le code pour masquer une partie d'un titre (24SEP09) comme dans l'exemple suivant :
http://www.criterion.com/current/posts/1240

Merci.
IP archivée

kriztho

  • Global Moderator
  • Wisi Comment on décroche
  • *****
  • Hors ligne Hors ligne
  • Messages: 1490
    • Voir le profil
    • La veille techno du web
    • E-mail
Re : Mise en place d'un texte masqué ?
« Réponse #1 le: octobre 06, 2009, 12:05:39 pm »

Utilise Firebug pour analyser les CSS d'une page.
Voilà le style utilisé dans un <span> :
div#blog div.post p.date {
color:#FFFFFF;
font-size:90px;
font-weight:bold;
left:25px;
line-height:1.5;
margin:0 0 -78px;
padding:0;
position:relative;
text-transform:uppercase;
top:-38px;
}
A vue de nez :
Taille typo importante (90px).
Interligne spécifiée (1.5)
marge négative (-78px)
position relative avec un top à -38px.
Je suis un peu charrette, mais la piste est là. A approfondir.
« Modifié: octobre 06, 2009, 12:07:17 pm par kriztho »
IP archivée
______________________________________________________________
Je ne connais pas grand chose, mais je progresse...
[La veille techno du web] - [Histoire d'écrire de l'informatique]

Sam Moss

  • Wisi Addict
  • ***
  • Hors ligne Hors ligne
  • Messages: 201
    • Voir le profil
Re : Re : Mise en place d'un texte masqué ?
« Réponse #2 le: octobre 07, 2009, 00:13:09 am »

Utilise Firebug pour analyser les CSS d'une page.
Voilà le style utilisé dans un <span> :
div#blog div.post p.date {
color:#FFFFFF;
font-size:90px;
font-weight:bold;
left:25px;
line-height:1.5;
margin:0 0 -78px;
padding:0;
position:relative;
text-transform:uppercase;
top:-38px;
}
A vue de nez :
Taille typo importante (90px).
Interligne spécifiée (1.5)
marge négative (-78px)
position relative avec un top à -38px.
Je suis un peu charrette, mais la piste est là. A approfondir.


Merci pour la piste. Je vais faire des tests.
IP archivée
 



Wisibility est un sité dédié à la formation aux métiers l’image. Vous y trouverez différentes ressources vous aidant à maîtriser les logiciels graphiques tels que Photoshop, Lightroom, Illustrator, InDesign, Flash… Aujourd’hui, Wisibility réunie plus d'une vingtaine d’experts, intervenant en Entreprise pour former graphistes, webdesigners, développeurs web, photographes, monteurs, trucistes…
Depuis 2006 nous nous sommes spécialisés dans les tutoriels vidéos permettant de se former à distance. Notre forum très actif, géré par une équipe de bénévoles répondra à vos demandes. Vous pourrez également profiter de nos émissions et reportages sur la Wisi TV.
Contact - Wisibility est une marque déposée

Blog - Tutoriels - Wisi TV - Forum