精华内容
下载资源
问答
  • css设置背景图片,默认的样式是图片重复,有的时候页面只需要一个不重复背景图片,这就需要使用到css背景图片重复属性background-repeat: no-repeat;进行设置。css使用background-repeat设置背景图片不重复和不...

    css设置背景图片,默认的样式是图片重复,有的时候页面只需要一个不重复的背景图片,这就需要使用到css背景图片重复属性background-repeat: no-repeat;进行设置。

    2f3ff028da282bf6e4109569e3b40078.png

    css使用background-repeat设置背景图片不重复和不使用background-repeat属性对比。

    示例:

    不设置background-repeat属性

    body

    {

    background-image:

    url(/i/eg_bg_03.gif);

    }

    效果图:

    b48c81200f60dc86aacbc49f3e5bc56d.png

    使用background-repeat属性设置背景图片不重复。

    body

    {

    background-image:

    url(/i/eg_bg_03.gif);

    background-repeat: no-repeat

    }

    效果图:

    93a0fc6e1a9a07e0e6fec6b2d2964886.png

    background-repeat 属性定义了图像的平铺模式。

    属性值:repeat默认。背景图像将在垂直方向和水平方向重复。

    repeat-x背景图像将在水平方向重复。

    repeat-y背景图像将在垂直方向重复。

    no-repeat背景图像将仅显示一次。

    inherit规定应该从父元素继承 background-repeat 属性的设置。

    展开全文
  • css背景图片重复相关知识

    千次阅读 2018-06-30 20:00:54
    通过 background-repeat属性可以给插入的背景图片设置是否要重复,及按怎样重复。该属性可能的值值描述repeat默认。背景图像将在垂直方向和水平方向重复。repeat-x背景图像将在水平方向重复。repeat-y背景图像将在...

    通过 background-repeat属性可以给插入的背景图片设置是否要重复,及按怎样重复。

    该属性可能的值

    描述
    repeat默认。背景图像将在垂直方向和水平方向重复。
    repeat-x背景图像将在水平方向重复。
    repeat-y背景图像将在垂直方向重复。
    no-repeat背景图像将仅显示一次。
    inherit规定应该从父元素继承 background-repeat 属性的设置。

    例:.bird {
            width: 91px;
            height: 71px;
            background: url(http://img.mukewang.com/55ade1700001b38302730071.png)
            background-repeat: repeat

     }

    如果想控制图片重复出现的次数,把width值设置为图片宽度*你想出现的次数

    展开全文
  • 本文主要描述css3关于背景图片重复显示新增的属性; 什么也不设置时 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <...

    本文主要描述css3关于背景图片重复显示新增的属性;

    什么也不设置时

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            div{
                width: 550px;
                height: 550px;
                background-image: url("./心.png");
            }
        </style>
    </head>
    <body>
    <div></div>
    </body>
    </html>

    新增 background-repeat: round 使图片在重复的同时能够完整的显示,同时也对图片大小进行调整

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            div{
                width: 550px;
                height: 550px;
                background-image: url("./心.png");
                /*改变图片大小以至于重复时能够完整的显示图片*/
                background-repeat: round;
            }
        </style>
    </head>
    <body>
    <div></div>
    </body>
    </html>

    新增background-repeat: space;使图片在重复时完整显示,增加图片件的间隔,不拉伸图片;

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            div{
                width: 550px;
                height: 550px;
                background-image: url("./心.png");
                /*大小不变 在图片之前增加等量间距*/
                background-repeat: space;
            }
        </style>
    </head>
    <body>
    <div></div>
    </body>
    </html>

     

    展开全文
  • css设置背景图片不重复显示

    万次阅读 2019-01-20 17:16:24
    最近在项目中做菜单管理这块,每个一级菜单都有背景图(图片宽高都很小),设置完图片后,背景图重复显示,后来查阅资料才明白,原来设置完背景图后,不指定平铺属性,默认是横向纵向重复的,导致图片出现重复,指定...

            最近在项目中做菜单管理这块,每个一级菜单都有背景图(图片宽高都很小),设置完图片后,背景图重复显示,后来查阅资料才明白,原来设置完背景图后,不指定平铺属性,默认是横向纵向重复的,导致图片出现重复,指定下平铺属性

    css中background-repeat是设置图片平铺属性的,其中值有5个:

    1、repeat  横向和纵向重复,这是默认的

    2、repeat-x 横向重复

    3、repeat-y 纵向重复

    4、no-repeat 不重复

    5、inherit 设置background-repeat属性应该从父元素继承(IE9以上支持)

    代码如下:

    <a class="menu-a" href="javascript:;" style="background: url(${basePath}${model.minIconUrl } )  no-repeat 20px 16px;" <c:if test="${!empty model.RUrl}">οnclick="checkMenu('${model.RUrl}')"</c:if>>${model.RName }</a>

    好了,这样就不会出现重复的背景图了.

     

     

    展开全文
  • 在网页设计的时候,我给div容器设置背景图片,怎么设置,能使背景图片不重复,自适应容器大小充满。 在容器中插入图片,能达到预期效果,但背景图的话,不知道怎么设置背景图属性。
  • 标题添加Tab页面背景图片后出现窗体闪烁问题 首先,我在网上找了一些窗体闪烁的问题,多是说窗体加载需要添加双通道缓存。修改如下 在public Form()函数里面添加 SetStyle (ControlStyles.AllPaintingInWmPaint //...
  • 关于在HTML表格中插入背景图片图片重复显示的问题

    万次阅读 多人点赞 2015-05-13 19:15:40
    先来一段有问题的代码(其实也不能说是有问题,毕竟语法上是没问题的,只是出来的效果不是我们想要的——我们假设预期的效果是背景图片只填充一次而不是多次。) 设定表格的背景图像 姓名 张三 性别...
  • Android 背景图片重复 Background repeat

    千次阅读 2012-02-27 10:21:03
    本文转载自: ...以LinearLayout为例,它提供的background属性将会将背景图片拉伸,相当难看。事实上我们只需做少量的修改就可以实现web编程中css背景图片的效果。来试试吧。 Bitmap介绍 A Drawa
  • HTML设置背景图片是否重复

    千次阅读 2020-01-05 15:28:03
    在css中,background-repeat可设置图片是否重复及如何重复。 1、background-repeat:repeat是默认属性,设置该属性使图片在水平与垂直方向上重复。 2、background-repeat:no-repeat 图片仅显示一次。 3、background-...
  • ![图片说明](https://img-ask.csdn.net/upload/201610/22/1477131460_282926.png)
  • 用css3实现页面背景图片不重复

    千次阅读 2016-07-10 18:17:45
    出现这样的问题的原因是因为div的大小大于背景图片的大小,从而导致了背景图片的重复,其实在css3中解决像这样的问题特别简单只需要添加一个这样的样式即可  background-repeat:no-repeat; 加上这条语句之后一切...
  • CSS背景属性用于定义元素的背景效果,常用的有5种背景属性:背景颜色、背景图片、背景图片重复展示的方式、背景附着的方式以及背景位置 background-color background-image background-repeat background-attachment...
  • 关于HTML页面背景图片重复问题

    千次阅读 2012-04-20 23:12:54
  • MFC添加背景图片

    千次阅读 2019-06-19 09:22:13
    很长时间没有接触MFC相关的知识了,我大概是在大二时候...这篇文章主要是回顾以前的MFC基础知识,给对话框添加背景图片和给按钮button添加背景图片;希望此篇基础性文章对大家有所帮助!同时为下次做MFC相关知识提供...
  • css设置背景图

    2015-01-26 16:01:26
    css3之前,设置背景图片很不如意,出现缩放后的图片下面还是一片空白等等问题……
  • /*no-repeat 背景图不会重复,读取的位置为靠左靠上,宽度100%撑满(这里指的是上面设置的图片大小)*/ 现在浏览器中出现的为: 开始对背景图进行定位 .img50{ background-position:0 0;/* 横坐标纵坐标为0*/ } 以上...
  • ** 话不多说,直接上代码。 ** <head> <style> html,body{ width:100%; height:100%; } body{ margin:0; //这里一定要有,否则可能会出现重复或被边框截断 background...
  • css的背景背景图片的属性

    千次阅读 2017-07-29 23:12:50
    css背景图片的属性简介
  • 今天要解决一个用背景图以拉伸方式(不重复)填充背景的问题。 搜了一下这篇算是《css 如何让背景图片拉伸填充避免重复显示》说得比较全面了,但还没有很好解决。主要是少了background-attachment: fixed;的定义,...
  • 前言 大屏可视化在展示方式上之所炫酷是因为有很多科技感图形的衬托,这些图形可以来自图表...设置了backgroundSize之后,不同的分辨率下需要的背景图的宽高比也许不同,这样背景图呈现出来的效果可能会被拉伸或...
  • 在IE6中表现为:鼠标移上链接再移开便会出现短暂的闪烁,从HttpWatch和Fiddler中很明显的看到这个鼠标动作加载了两次该背景图片,所以更准确的描述是具有链接属性的背景图片在IE6中闪动和重复加载。   调用JS的...
  • html { background: url("./images/htmlbg.jpg") 0 0 no-repeat, url("./images/htmlbbg.jpg") 200px 0 repeat; background-position: 0 0, 200px 0; ...
  • HTML设置背景颜色及背景图片

    千次阅读 2020-08-26 23:17:27
    背景 background-color 设置背景颜色 background-color: red; background-image 设置背景图片 - 可以同时设置背景图片和背景颜色,这样背景颜色将会成为图片的背景色 - 如果背景的图片小于元素,则背景图片会自动在...
  • 一、背景 下面这些都是在开发的过程中,记录下来的笔记。 二、样式及背景图片显示问题 1、修改单个页面的背景色: 在页面的wxss里面加上这句代码: page{ background-color: lightcyan; } 2、小程序中的...
  • 在HTML中,当我们设置背景图,只能采用是否重叠、居中、重叠方向这几个选项 CSS3中设置 body { background:#3d71b8 url(../back_main.png); background-size: 100%; background-position:center; } ...
  • 背景图不够大,网页会出现如此的叠图效果:    如何解决这个问题?很简单,让图片居中显示并且让它直接cover在屏幕上:  body{ background-image: url("__PUBLIC__/images/bg.jpg"); background-position:...
  • css 背景图片属性

    千次阅读 2013-07-26 17:42:30
    背景图片重复 background-repeat:no-repeat repeat repeat-x repeat-y round space inherit !important;/*背景重复*/  background-attachment:fixed local scroll inherit !important; /*背景关联scroll 默认值。...
  • Qt用SVG图片作为背景图

    千次阅读 2018-06-14 11:09:45
    svg可缩放,作为背景图十分方便。Based on Qt 5.5.1 (MSVC 2013, 32 bit)1.使用QSvgWidget//添加一个widget 提升为QSvgwidget QString strFile="Dharma_Wheel.svg"; this-&gt;ui-&gt;svgWidget-&...
  • 在DW中插入背景图片

    千次阅读 2020-03-22 11:01:38
    打开DW CS4,新建HTML,点击下方的 页面属性 后出现一个页面框,选择 背景图片 浏览 ,把你所需要的图片选中,点击 确定 。...重复 是让你当前选中的背景图片在浏览器中重复出现或其他… 在这里插入图片描述 ...
  • JS——修改背景图片

    2019-08-08 14:52:55
    使用JS修改元素的背景图片 解决方法 1 使用 css() 给元素添加背景图片 这种方法添加的样式优先级相当于行内样式,会覆盖掉优先级比他低的样式 代码如下: $("css选择器").css("background","url("图片路径")"); 2 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 124,026
精华内容 49,610
关键字:

背景图重复出现