Comment créer css html à partir de Photoshop

Photoshop est une application de conception et de retouche photo graphique développé par Adobe. Il est le leader du marché des logiciels de retouche d'image numérique. Ses capacités incluent la possibilité de créer et de manipuler des graphiques pour l'impression et l'utilisation du Web. Il comprend également de nombreuses fonctionnalités pour aider les utilisateurs dans la conception de site Web et le codage. Non seulement peuvent les images de OPTIMIZE logiciel pour l'utilisation du web, il peut aussi générer des feuilles de style en cascade et le code HTML nécessaire pour inclure des graphiques dans les pages web.


Sommaire

  • Instructions
  • Choses que vous devez

    • Logiciel d'édition HTML

    Instructions

    1. 1

      Créer votre image. Lorsque vous avez terminé, utilisez de Photoshop "Tranche" outil pour diviser votre image en sections. Utilisez le "Sélection de tranche" outil pour renommer chaque section avec des noms qui correspondent à l'organisation de votre site. Par exemple, si votre image comprend sites boutons de navigation, sections de nom dans ce domaine "nav." Ces sections correspondent à "div" tags dans votre code CSS.

    2. 2


      Dans la barre de menu clic "Fichier" puis choisissez "Enregistrer pour le Web & Périphériques." Choisir "2-Up" ou "4-Up" des languettes au-dessus de la zone d'image pour une sélection d'extraits. Choisissez les options que vous voulez pour votre image dans le "Section Preset." Sélectionnez la aperçu d'image qui correspond le mieux à vos spécifications visuels. Cliquez "Enregistrer."

    3. 3




      Tapez le nom du fichier dans le "Nom de fichier" domaine. Sélectionner "HTML et images" dans le "Save as type" domaine. Sélectionner "Autre" dans le champ Paramètres. Une "Paramètres de sortie" boîte de dialogue apparaîtra. Dans les paramètres déroulante sélectionnez "Personnalisé." Sélectionnez le "Suivant" bouton jusqu'à ce que vous voyez le "Slice sortie" section. Sélectionnez le "Générer CSS" bouton radio.

    4. 4



      Choisissez le format de sortie de la CSS dans le menu de référencement. Pour une feuille de style externe, sélectionnez "Par ID" ou "Par classe." Votre CSS sera organisé par quelque élément que vous choisissez. Si vous voulez que votre CSS pour être en ligne (inclus dans le haut de votre page HTML), sélectionnez "En Ligne."

    5. 5

      Sélection complète d'autres options dans les paramètres de sortie. Lorsque vous avez terminé, cliquez sur "D'ACCORD." Dans le domaine de tranches de sélectionner ce que vous voulez tranches pour être inclus dans la sortie de CSS. Assurez-vous que vous avez navigué à l'endroit où vous voulez que le fichier soit situé dans le "Enregistrer optimisé" fichier zone de gestionnaire. Cliquez "Enregistrer."

    6. 6

      Ouvrez le fichier HTML que vous venez de créer dans votre programme d'édition HTML. Votre code HTML, avec CSS, sera là où vous l'avez enregistré sur votre ordinateur et prêt soit à insérer dans une page Web que vous créez ou comme une page Web autonome. Modifiez le code, si nécessaire, à votre goût.

    7. 7

      Ouvrez le fichier dans votre navigateur de choix pour voir le fichier pour vérifier les éventuels problèmes et pour vous assurer qu'il correspond à l'image que vous avez créé dans Photoshop.

    » » » » Comment créer css html à partir de Photoshop