Comment Faire Une Image De Fond Sur Un Site Web

Table des matières:

Comment Faire Une Image De Fond Sur Un Site Web
Comment Faire Une Image De Fond Sur Un Site Web

Vidéo: Comment Faire Une Image De Fond Sur Un Site Web

Vidéo: Comment Faire Une Image De Fond Sur Un Site Web
Vidéo: COURS COMPLET HTML ET CSS [42/71] - Images de fond et gestion du fond 2024, Peut
Anonim

Vous pouvez apprendre par vous-même les bases de la création de sites; il y a suffisamment d'informations sur ce sujet sur Internet et dans les livres. Cependant, au stade initial, des difficultés surviennent souvent dans l'utilisation de l'une ou l'autre étiquette. En effet, les composants les plus courants sont mieux retenus car ils sont essentiels lors de la rédaction de tout site Web.

Comment faire une image de fond sur un site Web
Comment faire une image de fond sur un site Web

Instructions

Étape 1

Sélectionnez l'image que vous souhaitez utiliser comme image d'arrière-plan. Si vous avez l'intention d'insérer du texte sur l'illustration, dans ce cas, il est conseillé de vous limiter à des options sans panachure excessive, dans lesquelles plusieurs couleurs sont utilisées de nature proche. En principe, pour éliminer les ondulations, vous pouvez créer un "arrière-plan" pour le contenu - et le problème sera résolu avec succès.

Étape 2

Corrigez l'image à l'aide d'Adobe Photoshop. Lorsque vous avez terminé, choisissez la commande Enregistrer pour le Web dans le menu Fichier et sélectionnez le dossier de votre choix. S'il s'agit de la première image à utiliser pour le site, alors un dossier "Images" est automatiquement créé.

Étape 3

Dans la balise, écrivez l'attribut background = "path to image". Exemple d'enregistrement: ou. En même temps, gardez à l'esprit que la balise ne doit apparaître qu'une seule fois dans le code, elle ne doit pas être multipliée.

Étape 4

Enregistrez les modifications dans le bloc-notes, cliquez sur le bouton "Actualiser" dans le navigateur. Le fond d'écran apparaîtra à l'écran. Si les dimensions de l'image sont inférieures aux paramètres de la page Web, alors l'image sera dupliquée autant de fois que nécessaire pour remplir tout l'espace. Il existe deux manières de corriger cette lacune:

• à l'aide du programme Adobe Photoshop, définissez les paramètres d'image souhaités en pixels ("Image" - "Taille de l'image");

• définir les dimensions requises dans le code html.

Par exemple, si la largeur est de 1250 px et la hauteur de 650 px, vous devez ajouter les attributs nécessaires pour la cellule du tableau dans laquelle l'image sera placée.

Vous ne pouvez pas définir la taille dans la balise - l'image sera toujours affichée en taille réelle.

Étape 5

Analogue de ccs pour insérer une image de fond:

image de fond

CORPS {

image d'arrière-plan: url (images / bg.jpg);

}

L'attribut "background-image: url (images / bg.jpg)" est le chemin vers l'image de fond.

Conseillé: