CSS 背景重复

爱被打了一巴掌 2022-10-22 09:19 176阅读 0赞

# CSS 背景重复 #

### 文章目录 ###

*  CSS 背景重复

> CSS background-repeat  
> 默认情况下，background-image 属性在水平和垂直方向上都重复图像。  
> 某些图像应只适合水平或垂直方向上重复，否则它们看起来会很奇怪，如下所示：  
> ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1hSVE9OWQ_size_16_color_FFFFFF_t_70]

<!DOCTYPE html>
    <html>
    <head>
    <style> body { background-image: url("/i/css/gradient_bg.png"); } </style>
    </head>
    <body>
    
    <h1>Hello World!</h1>
    
    <p>奇怪的背景图片...</p>
    
    </body>
    </html>

> 在水平方向重复。

<!DOCTYPE html>
    <html>
    <head>
    <style> body { background-image: url("/i/css/gradient_bg.png"); background-repeat: repeat-x; } </style>
    </head>
    <body>
    
    <h1>Hello World!</h1>
    
    <p>在这里，背景图像仅在水平方向上重复！</p>
    
    </body>
    </html>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1hSVE9OWQ_size_16_color_FFFFFF_t_70 1]

> background-repeat: repeat-x;

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1hSVE9OWQ_size_16_color_FFFFFF_t_70]: /images/20221022/602330ba9a004660af76aa118912c26d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1hSVE9OWQ_size_16_color_FFFFFF_t_70 1]: /images/20221022/bfc5758625644ca08b047bcb59604205.png

发表评论取消回复

表情：

评论列表（有 0 条评论，176人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS_背景

一、背景颜色 background-color设置背景颜色二、背景图片 background-image:url("./img/1.png") 2.1、ba

r囧r小猫/ 2023年10月06日 16:55/ 0 赞/ 55 阅读

相关 css背景透明(css背景透明度怎么设置)

CSS 背景颜色透明怎么弄外层div: background-color: rgba(255, 255, 255, 0.9); /\ 白色并且阿尔法通道是0.9\/

我会带着你远行/ 2023年09月26日 13:14/ 0 赞/ 27 阅读

相关 css背景属性_背景重复（CSS属性）

css背景属性描述 (Description) The `background-repeat` property controls whether or not a

深藏阁楼爱情的钟/ 2022年12月03日 11:26/ 0 赞/ 296 阅读

相关 CSS 背景

CSS 背景文章目录 CSS 背景不透明度解决方案 ![在这里插入图片描述][20210323145105218.gif] CSS 背景

客官°小女子只卖身不卖艺/ 2022年11月12日 09:38/ 0 赞/ 222 阅读

相关 CSS 背景重复

CSS 背景重复文章目录 CSS 背景重复 > CSS background-repeat > 默认情况下，background-image 属性在水

爱被打了一巴掌/ 2022年10月22日 09:19/ 0 赞/ 177 阅读

相关 CSS背景

1.背景颜色： background-color: \bfa; 2.背景图片：background-image: url(""); 如果同时设置背景颜色和背景图片，则背景颜

浅浅的花香味﹌/ 2022年09月03日 12:28/ 0 赞/ 271 阅读

相关（CSS入门）css添加+背景图像+背景重复

css添加当浏览器读到样式表时，它将根据样式表中的信息来格式化 HTML 文档。三种使用 CSS 的方法有三种插入样式表的方法：外部css

布满荆棘的人生/ 2022年09月03日 02:29/ 0 赞/ 267 阅读

相关 css_背景

1. CSS背景 <table> <tbody> <tr> <td><p>属性</p></td> <td><p>描述</p></td> </t

青旅半醒/ 2022年05月25日 04:53/ 0 赞/ 268 阅读

相关 CSS背景

1.设置页面的背景颜色 body{ margin:0px; background-color:l

落日映苍穹つ/ 2021年12月10日 23:51/ 0 赞/ 433 阅读

相关 CSS背景

背景 <table> <thead> <tr> <th align="left">属性</th> <th align="left">描述</th

曾经终败给现在/ 2021年10月19日 10:18/ 0 赞/ 444 阅读