Home >Web Front-end >CSS Tutorial >How to set images not to be tiled in css
How to set images not to be tiled in css
- coldplay.xixiOriginal
- 2021-04-29 15:29:485435browse
The way to set the image to be non-tileable in css is to use the [background-repeat] attribute to set the image to be non-tileable, where [no-repeat] means not to tile, that is, it will only be displayed once.
The operating environment of this tutorial: windows7 system, css3 version, DELL G3 computer.
How to set the image to be non-tiled in css:
css can use the background-repeat attribute to set the image to be non-tiled.
Attribute value:
repeat: Tile in both horizontal and vertical directions, this is also the default value
no -repeat: No tiling, that is, only displayed once
repeat-x: Only tiling along the horizontal direction
repeat-y: Only along the horizontal direction Vertical tiling
#The position of the background image is set according to the background-position property. If the background-position property is not specified, the image will be placed in the upper left corner of the element.
Example:
Set the picture not to be tiled
<body>
<style>
.box{ border:1px solid #093; width:800px; height:800px;
background:url(img/3.jpg)no-repeat;}
</style>
<div class="box">
hello word
</div>
</body>Rendering:
Recommended related tutorials: CSS video tutorial
The above is the detailed content of How to set images not to be tiled in css. For more information, please follow other related articles on the PHP Chinese website!