Les capacités du langage de balisage - HTML - et des feuilles de style en cascade - CSS - vous permettent de placer une image dans une autre de plusieurs manières. Bien sûr, cela nécessite des compétences en mise en page Web et vous devez choisir une méthode spécifique basée sur le code existant. Cependant, dans certains cas, vous pouvez vous passer de modifier le code source.
Instructions
Étape 1
Il existe un moyen de mettre une image dans une autre sans aucun changement dans les pages du site. Pour ce faire, il suffit d'éditer l'image d'arrière-plan stockée sur le serveur - utilisez n'importe quel éditeur graphique pour y placer l'image de premier plan. Si cette méthode fonctionne pour vous, commencez par définir l'emplacement de stockage et le nom du fichier d'image d'arrière-plan. Cela peut être fait en le trouvant dans le code source de la page ou en l'ouvrant dans un onglet séparé et en regardant le chemin complet dans la barre d'adresse du navigateur.
Étape 2
À l'aide du gestionnaire de fichiers du système de gestion de contenu ou du client FTP, téléchargez le fichier requis sur votre ordinateur et ouvrez-le dans n'importe quel éditeur graphique - par exemple, dans l'application Paint installée avec Windows.
Étape 3
Placez l'image de premier plan sur l'arrière-plan - dans Paint pour cela, vous devez sélectionner l'élément "Insérer depuis" dans la liste déroulante "Insérer" de l'onglet "Accueil" et rechercher le fichier requis dans la boîte de dialogue qui s'ouvre. Ajustez ensuite la position de l'image insérée sur le fond existant (faites-le glisser avec la souris) et enregistrez le résultat (Ctrl + S).
Étape 4
Rechargez l'image modifiée en écrasant l'ancienne. Ceci termine la procédure.
Étape 5
Le procédé décrit n'est pas pratique dans le cas où les images insérées doivent être modifiées de temps en temps. Utilisez ensuite les capacités du langage HTML - par exemple, faites de l'image d'arrière-plan l'arrière-plan de l'élément de page dans lequel l'image de premier plan sera placée. Un tel élément conteneur peut être, par exemple, une couche (div). Pour faire d'une grande partie des images son arrière-plan, vous devez utiliser la description de style - l'attribut de style de la balise div. Un conteneur vide dans du code HTML peut ressembler à ceci:
Entre parenthèses, indiquez l'adresse et le nom du fichier image de fond sur votre site.
Étape 6
Créez une balise d'image de premier plan (img), en utilisant le même attribut de style pour définir la quantité de remplissage à partir des bords du conteneur d'arrière-plan. Par example:
Ici, les attributs de largeur et de hauteur définissent les dimensions de l'image, et les quatre nombres après le remplissage indiquent le remplissage en pixels à partir des bords du conteneur, en commençant par le haut (50) et plus loin dans le sens des aiguilles d'une montre (60 - à droite, 70 - en bas, 80 - gauche).
Étape 7
Placez la balise img dans un conteneur:
Étape 8
Ajoutez les lignes créées au code source de la page, puis, en modifiant les retraits, ajustez la position de l'image insérée par rapport à l'arrière-plan de l'image d'arrière-plan.
