Maison > interface Web > tutoriel CSS > Pouvez-vous définir les dimensions des balises d'ancrage pour les images d'arrière-plan ?

Pouvez-vous définir les dimensions des balises d'ancrage pour les images d'arrière-plan ?

Susan Sarandon
Libérer: 2024-10-30 17:53:31
original
322 Les gens l'ont consulté

Can You Set Dimensions on Anchor Tags for Background Images?

Définition des dimensions sur les balises d'ancrage pour les images d'arrière-plan

Est-il possible de définir des dimensions spécifiques (largeur et hauteur) sur les balises d'ancrage tout en incorporant un image de fond ? Ce scénario permet de conserver un élément de texte au sein de l'ancre tout en conservant l'image d'arrière-plan.

Solution :

Pour ce faire, l'élément d'ancrage doit se voir attribuer un propriété d'affichage du bloc ou du bloc en ligne. Ce faisant, il devient capable d'accepter à la fois les valeurs de largeur et de hauteur.

Exemple :

<code class="css">li {
  display: inline-block;
  width: 32px;
  height: 32px;
  background-color: orange;
}

li a {
  width: 32px;
  height: 32px;
  background-color: red;
}</code>
Copier après la connexion
<code class="html"><li><a href="#">Something</a></li></code>
Copier après la connexion

Dans cet exemple, la balise d'ancrage dans le li est configuré pour s'afficher sous forme de bloc en ligne et se voit attribuer une largeur et une hauteur de 32 pixels. Il a également une couleur de fond rouge, tandis que la couleur de fond de l'élément li est orange. Le texte « Quelque chose » reste visible dans la balise d'ancrage, comme vous le souhaitez.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal