Question

J'avais mon site conçu par un designer, j'ai cette image de celui-ci, je veux utiliser le même genre d'image pour les autres menus de navigation que je veux ajouter maintenant, mon concepteur ne me fournit avec psd`s de celui-ci .

  text alt

Comment puis-je savoir quels sont les effets de texte et les polices que je devrais utiliser dans Photoshop pour obtenir le même genre de résultat?

Merci.

Était-ce utile?

La solution

Ce n'est pas une question de programmation, mais je pense que je peux vous aider.

  • Font-face: Verdana (régulier)
  • Taille du texte: 14 / 15pt Couleur: # 333333
  • Le texte a un style de calque> biseau et emboss> Style: Emboss
    • Taille et ramollir les deux 0px
  • Texte gauche: direction biseau vers le haut
  • Texte droite: le sens du biseau vers le bas

Je vous jouez avec les angles d'ombrage et met en évidence, vous devriez être en mesure de reproduire l'effet.

Autres conseils

Couche> Style de calque> biseau et gaufrer

mais cela peut être atteint sans une image dans les navigateurs qui prennent en charge le text-shadow propriété css

Quelque chose comme ceci

text-shadow: 0px 1px 0px #B5B5B5;

Qu'est-ce que la police a satisfait ma police reconnaissant à ce jour besoins.

Il semble en fait comme le traitement de texte est un peu incohérent. Dans l'image à gauche, l'effet est un biseau élevé qui vient vers vous et dans le droit, il est un effet de presse lettre.

L'image à droite est un peu plus compliqué du point de vue du traitement de texte. Lorsque dans Photoshop, sélectionnez le calque de texte et regarder vers le bas de votre menu couches pour « FX ». Choisissez « FX » et une fenêtre apparaîtra.

Sélectionnez incrustation en dégradé et en utilisant le gradient mis en blanc comme couleur de premier plan et le noir comme couleur de fond (il devrait par défaut à ce). Apportez l'opacité à environ 15%.

Consultez ensuite à la barre latérale de gauche à l'ombre et sélectionnez tomber. Choisissez superposition au lieu de la normale dans le menu déroulant et changez votre couleur en blanc (en cliquant sur le swatch noir à côté de la chute vers le bas). Tous vos angles / direction devrait être de 120 degrés pour cela. Alors qu'il était encore dans la liste déroulante des options pour régler la distance 2px et votre taille à 3PX.

Enfin, appliquez une ombre intérieure. Probablement la distance et la taille et doivent refléter celle de l'ombre portée donnée ci-dessus.

Pour l'arrière-plan de l'onglet, on dirait qu'ils sont en train de faire deux choses. appliquer d'abord un revêtement dégradé sur l'onglet, puis un léger effet d'éclairage. En fait, l'effet d'éclairage peut être difficile à reproduire à cette subtilité donc faire l'une des deux choses. Créer une autre couche au-dessus de l'onglet et créer une sélection de l'onglet existant (vous devez vous assurer que la première couche de l'onglet est pixellisée de le faire) et remplir de blanc. Ensuite, appliquez l'effet d'éclairage et réglez l'opacité de la couche pour obtenir l'effet désiré. Ou si vous êtes un peu artistique, vous pouvez utiliser l'outil pinceau avec un faible remplissage et le poids d'opacité pour repérer essentiellement l'onglet au milieu avec le blanc.

Pour l'image à droite, utiliser le même processus pour traiter l'onglet simplement changer votre couleur de remplissage ou de dégradé couleurs de premier plan de superposition et de fond et le texte utiliser une simple ombre portée avec la distance 2 ou 3 pixels et la taille 2px.

Il y a un bon tutoriel ici sur effet letterpress (défilement vers le bas pour voir l'instruction).

L'espoir qui aide.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top