精华内容
下载资源
问答
  • DIV缩放背景自适应(不变形)jQuery-HoverTreea{color:white;}body{font-family:幼圆,宋体,'Times New Roman', Times, serif;color:white;}.picwidth{width:100%;text-align:left;filter:"progid:DXImageTransform....
    DIV缩放背景自适应(不变形)jQuery-HoverTree

    a{color:white;

    }body{font-family:幼圆,宋体,'Times New Roman', Times, serif;color:white;

    }.picwidth{width:100%;text-align:left;filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";-moz-background-size:100% 100%;background-size:100% 100%;

    }body{margin:0px;background-color:#120c0c;

    }.content{width:206px;margin:0px auto;padding-top:10px;line-height:16px;

    }.frame{width:256px;margin:0px auto;

    }

    原文

    展开全文
  • 制作页面要在表格内插入背景图时,我们可以使用CSS进行控制,代码如下:style="background-image:url(./images/counter_bg.jpg);background-repeat: no-repeat;background-position: right bottom;"其中,./images/...

    制作页面要在表格内插入背景图时,我们可以使用CSS进行控制,代码如下:

    style="background-image:url(./images/counter_bg.jpg);background-repeat: no-repeat;background-position: right bottom;"

    其中,./images/counter_bg.jpg为显示图片路径。

    如果现在需要实现背景图随表格拉伸而不重复的拉伸填充,如何实现?

    制作方法:

    建立表格,并在

    style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='', sizingMethod='scale')"

    不过此方法仅支持IE,不支持FF。

    附:Css背景参数,用法:

    序号 中文说明 标记语法

    1 背景颜色 {background-color:数值}

    2 背景图片 {background-image: url(URL)|none}

    3 背景重复 {background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}

    4 背景固定 {background-attachment:fixed|scroll}

    5 背景定位 {background-position:数值|top|bottom|left|right|center}

    6 背影样式 {background:背景颜色|背景图象|背景重复|背景附件|背景位置}

    见有人提问,我放个实例出来说明一下( 在同目录下放一个“1.jpg”图片):

    CSS背景图拉伸
    1112131415
    2122232425
    3132333435
    1112131415
    2122232425
    3132333435

    上面的结果如下图所示:(空间出过问题,图没了,自己运行以上代码看吧。)

    展开全文
  • css背景图片拉伸填充的属性css背景图片拉伸填充的属性有哪些?就跟随百分网小编一起去了解下吧,想了解更多相关信息请持续关注我们应届毕业生考试网!比如一个容器(body,div,span)中设定一个背景。这个背景的长宽...

    css让背景图片拉伸填充的属性

    css让背景图片拉伸填充的属性有哪些?就跟随百分网小编一起去了解下吧,想了解更多相关信息请持续关注我们应届毕业生考试网!

    比如一个容器(body,div,span)中设定一个背景。这个背景的长宽值在css2.1之前是不能被修改的。

    所以实际的结果是只能重复显示,所以出现了repeat,repeat-x,repeat-y,no-repeat这些属性。就是用来

    控制背景图片的显示的.。所以一般用作背景图片的有2类:

    1.是一整张大图,尺寸和区域大小刚好吻合

    2.一个很小的条状图,通过repeat后,形成一个很规则的大图背景。

    但是css3出现以后,这个情况被改善了。background-size 属性可以让我们之前的希望成真。

    而且这个属性在firefox,chrome,以及ie9上都可以使用。

    具体使用方法如下:

    背景图尺寸(数值表示方式):

    #background-size{

    background-size:200px 100px;

    }背景图尺寸(百分比表示方式):

    #background-size2{

    background-size:30% 60%;

    }背景图尺寸(等比扩展图片来填满元素,即cover值):

    #background-size3{

    background-size:cover;

    }背景图尺寸(等比缩小图片来适应元素的尺寸,即contain值):

    #background-size4{

    background-size:contain;

    }背景图尺寸(以图片自身大小来填充元素,即auto值):

    #background-size5{

    background-size:auto;

    }

    【css让背景图片拉伸填充的属性】相关文章:

    展开全文
  • } btn_bg样式中:可是使用width和height定义背景图默认的宽高,假如这个不定义并且引用该样式的DIV也不定义宽度,那么背景图的宽度会拉伸至浏览器的宽度,另外可以指定DIV的宽度来拉伸背景图,如: 复制代码代码...

    兼容主流浏览器,包括Firefox、Chrome以及 IE 等主流浏览器(IE使用滤镜效果实现):

    .btn_bg {

    background-image:url(/images/headbg.png);

    -moz-background-size: 100% 100%;

    -o-background-size: 100% 100%;

    -webkit-background-size: 100% 100%;

    background-size: 100% 100%;

    -moz-border-image: url(/images/headbg.png) 0;

    background-repeat:no-repeat\9;

    background-image:none\9;

    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/headbg.png', sizingMethod='scale')\9;

    }

    btn_bg样式中:可是使用width和height定义背景图默认的宽高,假如这个不定义并且引用该样式的DIV也不定义宽度,那么背景图的宽度会拉伸至浏览器的宽度,另外可以指定DIV的宽度来拉伸背景图,如:

    复制代码代码如下:

    细心的你会发现,最后三行代码每行样式后都加了 \9 这是指定在IE8及以下浏览器中的样式。

    展开全文
  • background-size属性可以让我们之前的让背景图片拉伸填充的希望成真,具体使用方法如下感兴趣的朋友可以参考下哈,希望对大家有所帮助如何让背景图片拉伸填充,这个问题听起来似乎很简单。但是很遗憾的告诉大家。...
  • css可以使用background-size属性设置背景图片拉伸,此属性规定背景图像的尺寸。使用background-repeat属性设置背景图片不重复,此属性设置是否及如何重复背景图像。css设置背景图片拉伸不重复的css属性介绍:1、...
  • 因此我总结了三个拉伸背景图片的方法,结合了CSS+html+jquery三个技术,不需要很大的图片,不过拉伸后图片会有失真,如果你的网站背景图片要求不是很真很清晰,可以参考哦。方法一:CSS方法,这个方法有个缺陷,就是...
  • } 总结: 做响应式布局的时候,如果有背景图,我们当然希望他能够全屏100%显示,这样显得页面非常的爆满,不过这又出现了一个问题,图片的尺寸多大合适呢,现在的浏览器分辨率参差不齐,对于Firefox等高级的浏览器...
  • 拉伸 (无节操的拉伸,容器长宽完全超出背景图的长宽)重复展示(用无数张同样的图片来铺满容器的背景面积)x轴 /y轴 重复展示(纵向拉伸不重复 / 横向拉伸不重复 )background-repeat 这个货看下它的值:repeat默认。...
  • 制作页面要在表格内插入背景图时,我们可以使用CSS进行控制,代码如下: style="background-image:url(./images/counter_bg.jpg);background-repeat: no-repeat;background-position:
  • 在 H5 开发中,对于图片的显示可以通过 img 标签的方式或者设置 dom 元素的背景图片来实现;background-image 属性为元素设置背景图像。元素的背景占据了元素的全部尺寸,包括内边距和边框,但不包括外边距。默认地...
  • CSS背景图拉伸自适应尺寸: 兼容IE8及以上,以及其他浏览器! .bg{ background:url(http://wyz.67ge.com/wp-content/uploads/qzlogo.jpg); filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader...
  • 背景图完美适配配视口 body { background-image: url('https://images.unsplash.com/photo-1573480813647-552e9b7b5394?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2253&...
  • 背景图尺寸大于屏幕尺寸,背景图只显示跟屏幕一样大小内容小屏时: 如效果图所示,图片并没有发生压缩、或者缩小比例,它只是显示跟屏幕尺寸大小的内容,至于如何控制缩小浏览器时图片的变化,可以使用css的...
  • CSS背景图拉伸不变形

    千次阅读 2015-08-02 14:55:00
    在线效果体验:... 请使用手机浏览器查看。 css代码: .bg{ background:url(http://hovertree.com/texiao/mobile/3/hovertree01.jpg); filter:"progid:DXImageTransform.Microsoft.Alpha...
  • css实现背景图拉伸

    千次阅读 2011-07-27 16:46:48
    制作页面时,有时需要在表格内插入背景图,我们可以使用CSS进行控制,代码:style="background-image:url(./images/counter_bg.jpg);background-repeat: no-repeat;background-position:
  • css设置背景图拉伸铺满!

    万次阅读 2018-06-24 20:29:02
    css样式里设置背景图片拉伸充满有几种方法:1、用body里设置(但是这样的缺点是只能横向充满,高度是按比例拉伸的):background-size:100%;或者:background-size:cover;示例代码:body{ background-image:url...
  • DIV缩放背景自适应(不变形)jQuery-HoverTreea{color:white;}body{font-family:幼圆,宋体,'Times New Roman', Times, serif;color:white;}.picwidth{width:100%;text-align:left;filter:"progid:DXImageTransform....

空空如也

空空如也

1 2 3 4 5 ... 19
收藏数 365
精华内容 146
关键字:

背景图拉伸css