Comment définir l'arrière-plan pour qu'il soit centré et non carrelé en CSS-Questions et réponses frontales-php.cn

Comment définir l'arrière-plan pour qu'il soit centré et non carrelé en CSS

WBOY

Libérer： 2022-04-20 17:32:43

original

2807 Les gens l'ont consulté

En CSS, vous pouvez utiliser "background:url(path) no-repeat center;" pour définir l'arrière-plan pour qu'il soit centré et non en mosaïque. L'attribut background est utilisé pour définir le style d'arrière-plan de l'élément. " est utilisé pour indiquer que l'arrière-plan n'est pas carrelé. Centre Utilisé pour indiquer que l'arrière-plan est centré.

Comment définir l'arrière-plan pour qu'il soit centré et non carrelé en CSS

L'environnement d'exploitation de ce tutoriel : système Windows 10, version CSS3&&HTML5, ordinateur Dell G3.

Comment définir l'arrière-plan pour qu'il soit centré et non carrelé en CSS

Utilisez simplement l'attribut background.

L'attribut d'abréviation d'arrière-plan peut définir tous les attributs d'arrière-plan dans une seule instruction.

Séparez chaque valeur par un espace, sans ordre particulier. Il est possible que seules certaines de ces valeurs, comme background : #FF0000 URL (smiley.gif) soient autorisées.

Les attributs pouvant être définis sont :

background-color Spécifiez la couleur d'arrière-plan à utiliser
background-position Spécifiez la position de l'image d'arrière-plan
background-size Spécifiez la taille de l'image d'arrière-plan. background image
background-repeat Spécifie comment répéter l'image d'arrière-plan Si l'image est fixe ou suit la page Le reste du défilement.
background-image Spécifiez une ou plusieurs images d'arrière-plan à utiliser
Les exemples sont les suivants :

<html>
<head>
<style type="text/css">
body
{ 
background: url(/i/eg_bg_03.gif) no-repeat center; 
}
</style>
</head>
<body>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
<p>这是一些文本。</p>
</body>
</html>

Copier après la connexion