美文网首页
5. div背景图的设置

5. div背景图的设置

作者: yaoyao妖妖 | 来源:发表于2018-09-07 13:57 被阅读6次

注意:在使用了单独的设置背景图时,不要再使用background,因为会将样式覆盖

规定背景图像的尺寸:
div
{
   background:url(img_flwr.gif);
   background-size:80px 60px;  
   background-repeat:no-repeat;
}
background-size: length|percentage|cover|contain;
  • length

设置背景图像的高度和宽度。

第一个值设置宽度,第二个值设置高度。

如果只设置一个值,则第二个值会被设置为 "auto"。

  • percentage

以父元素的百分比来设置背景图像的宽度和高度。

第一个值设置宽度,第二个值设置高度。

如果只设置一个值,则第二个值会被设置为 "auto"。

  • cover

把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。

背景图像的某些部分也许无法显示在背景定位区域中。

  • contain
    把图像图像扩展至最大尺寸,以使其宽度和高度完全适应内容区域。 |

相关文章

  • 5. div背景图的设置

    注意:在使用了单独的设置背景图时,不要再使用background,因为会将样式覆盖 length 设置背景图像的高...

  • css实现背景虚化

    实现原理 内容和背景图片分别置于一个div,通过css设置背景div模糊度,设置内容div绝对定位。 代码 htm...

  • 简单的登录静态页面总结

    1.模糊背景图的设置 设置两个div,一个放置背景图片,一个放置内容 放置背景图片 放置内容 设置css样式 .o...

  • CSS&JS一些问题

    实现div横向排列,元素往两边撑, 中间自动撑开空格。在父元素里设置 背景图片自适应div 背景图片自适应 tex...

  • html,css所遇问题(一)

    div中添加背景图片必须设置宽高 例如:下述代码没有设置icon的宽高值,那么网页中也不会显示出背景图片,因为di...

  • HTML/CSS 设置背景图片一屏幕下水平垂直居中

    1、直接设置最大div高度为100vh,设置背景图水平垂直居中2、使用绝对定位 + translate 位移 案例...

  • css背景blackground

    1)背景图片**background-image: **url(1.jpg) 1,div{ 2)设置背景平铺bac...

  • vue背景图片用样式绑定的方式

    vue中为div设置背景图片,直接在css中这样写: background-image:url("/assets/...

  • css样式

    1,设置div的背景图片 也不知道为有的人只写了一个100%,可能是图片刚刚好适应高度 1,设置div内容垂直居中

  • 阅读CSS Secrets(七)

    连续图片边框 大家看到这张图 一开始的想法是怎么去实现呢1.可以使用div+div来实现,外div设置背景图和pa...

网友评论

      本文标题:5. div背景图的设置

      本文链接:https://www.haomeiwen.com/subject/ahlcgftx.html