Comment définir la couleur d'arrière-plan en HTML ? Analyse détaillée du code couleur d'arrière-plan HTML-tutoriel HTML-php.cn

Comment définir la couleur d'arrière-plan en HTML ? Analyse détaillée du code couleur d'arrière-plan HTML

寻∝梦

Libérer： 2018-09-11 13:38:33

original

115014 Les gens l'ont consulté

Cet article utilise le code HTML et le code de style CSS pour vous montrer comment définir la couleur d'arrière-plan du HTML. Il y a également une introduction sur la façon de définir l'image d'arrière-plan plus tard. J'espère que cela aidera tout le monde, jetons un œil à cet article maintenant

Tout d'abord, jetons un œil à la définition de la couleur d'arrière-plan en HTML :

Nous Tout d'abord, définissez une couleur d'arrière-plan. Définissez la couleur d'arrière-plan dans la balise body et voyons l'effet :

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网</title>
</head>
<body bgcolor="black">
这是PHP中文网
</body>
</html>

Copier après la connexion

Définissez la couleur d'arrière-plan sur noir. Pouvez-vous penser à l'effet qu'il affichera. dans le navigateur ?

Comment définir la couleur darrière-plan en HTML ? Analyse détaillée du code couleur darrière-plan HTML

Oui, c'est l'effet, rien ne peut être vu. Voyons si nous pouvons définir la couleur de la police sur une couleur et voir si elle peut être affichée :

<body bgcolor="black">
<p>这是<font color="#E41316">PHP中文网</font></p>
</body>

Copier après la connexion

Regardons maintenant l'effet :

Comment définir la couleur darrière-plan en HTML ? Analyse détaillée du code couleur darrière-plan HTML

Est-il évident que l'ajout d'une couleur à la police affichera le texte, mais là y a-t-il encore deux mots ? Aucune couleur n'est ajoutée, donc elle ne peut toujours pas être affichée.

Voyons maintenant comment créer un arrière-plan de texte :

<body bgcolor="black">
<p style="background-color: #E12125">这是PHP中文网</p>
</body>

Copier après la connexion

La balise font ne fonctionne plus pour le moment, nous utilisons donc de manière décisive les styles CSS Changeons la couleur d'arrière-plan. Comme vous pouvez le voir, il s'agit d'un simple style CSS qui définit uniquement une couleur d'arrière-plan.

Regardons l'effet affiché dans le navigateur :

Comment définir la couleur darrière-plan en HTML ? Analyse détaillée du code couleur darrière-plan HTML

En raison de la balise p, l'arrière-plan Il occupe toute la rangée. De cette façon, l'effet semble plus évident, donc je ne vais pas l'encadrer. Je vais juste vous apprendre la méthode. Lorsque nous ne pouvons pas utiliser autant d'arrière-plan, nous pouvons ajouter une balise div autour de la balise p et définir la largeur. est la largeur du texte, de sorte que l'arrière-plan du texte ne soit pas affiché sur une seule ligne. C'est également l'une des méthodes couramment utilisées.

Bien sûr, vous pouvez également utiliser des images comme images d'arrière-plan. Jetons un coup d'œil aux exemples d'effets :

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网</title>
</head>
<body style="background-image: url(https://img.php.cn/upload/article/000/000/003/5a9675a3b2106284.jpg)">
<p>这是PHP中文网</p>
</body>
</html>

Copier après la connexion

Il s'agit d'une image copiée en ligne. L'effet est C'est toujours très évident, regardons l'exemple maintenant :

Comment définir la couleur darrière-plan en HTML ? Analyse détaillée du code couleur darrière-plan HTML

Ceci est utilisé comme arrière-plan de toute la page Web. Nous pouvons trouver de belles images provenant d'autres endroits qui peuvent être utilisées comme images d'arrière-plan. Nous pouvons cliquer avec le bouton droit sur cette image, sélectionner l'adresse de copie de l'image et l'ajouter à cette URL. C'est également très simple. Vous pouvez vous entraîner davantage ci-dessous pour voir si l'effet est le même que le mien.

Cet article sur la définition de la couleur d'arrière-plan en HTML se termine ici. Si vous souhaitez en savoir plus, rendez-vous sur le site Web PHP chinois et apprenez-le dans la colonne Manuel d'apprentissage HTML. Si vous avez des questions, vous pouvez laisser un message ci-dessous.

【Recommandation de l'éditeur】

Comment définir des espaces dans les éléments de paragraphe HTML ? Récapitulatif des paramètres de l'espace HTML

Comment utiliser la grosse balise en html ? Exemples d'utilisation de la grande balise HTML

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!