Les partenaires publicitaires:

Comment faire une ombre portée à une mise en page de Blogger

Pour ajouter un effet d'ombre portée à une mise en page Blogger.com, vous allez utiliser la valeur de CSS "box-shadow". La valeur "box-shadow" ajoute une boîte de l'ombre à une section dans la mise en page ou un élément spécifique comme autour d'une image de poste. La valeur "box-shadow" est ensuite modifiée avec la boîte rembourrage de votre choix. Vous aussi choisir la couleur de la boîte de l'ombre, donc avoir le code couleur HTML prêt avant de commencer. Sauvegardez votre modèle avant de modifier tout codage.

Choses que vous devez

  • Bloc-notes ou un autre éditeur de texte (optionnel)

Instructions

  1. Ouvrez un navigateur Web. Allez sur le site Blogger sur Blogger.com. Saisissez votre email et votre mot de passe. Cliquez sur le gris "Connexion" pour aller à la page "tableau de bord".

  2. Cliquez sur le lien bleu "Design" pour aller à la page "Design". Cliquez sur "Modifier le code HTML" pour aller à la page "Modifier le modèle".

  3. Faites défiler jusqu'à la section dans le modèle HTML où vous voulez ajouter l'ombre portée. Par exemple, vous voulez ajouter au corps principal. Le codage ressemble à ceci:

    body {

    fontes: $ (body.font);

    couleur: $ (body.text.color);

    fond: $ (body.background);

    }

  4. Ajouter une ligne à la dernière ligne de codage juste au-dessus du support final. Tapez "box-shadow:" dans cet espace. Pour cet exemple, il ressemble à ceci:




    body {

    fontes: $ (body.font);

    couleur: $ (body.text.color);

    fond: $ (body.background);

    box-shadow:

    }

  5. Ajouter le rembourrage zone d'ombre, en pixels à la "box-shadow -moz:" la valeur. Le premier nombre est pour l'ombre horizontale et le second est pour l'ombre verticale. Pour l'exemple, il ressemble à ceci:

    body {

    fontes: $ (body.font);

    couleur: $ (body.text.color);

    fond: $ (body.background);



    box-shadow: 10px 10px

    }

  6. Ajouter de la couleur de l'ombre portée, avec un signe "#" en face d'elle comme avec toute autre valeur de couleur. Fermez la valeur avec un point-virgule. Pour cet exemple, il ressemble à ceci:

    body {

    fontes: $ (body.font);

    couleur: $ (body.text.color);

    fond: $ (body.background);

    box-shadow: 10px 10px # 888888;

    }

  7. Cliquez sur le bouton orange "Enregistrer le modèle". Cliquez sur le lien "Afficher le Blog" pour montrer l'ombre portée.

Conseils Avertissements

  • Utilisez le Bloc-notes ou un autre éditeur de texte pour écrire le codage. Ensuite, copiez et collez-le dans le modèle principal.
» » » » Comment faire une ombre portée à une mise en page de Blogger