zoukankan      html  css  js  c++  java
  • CSS3 background-size 属性

    示例:

    <!DOCTYPE html>
    <html>
    <head>
    <style> 
    body
    {
    background:url(/i/bg_flower.gif);
    background-size:63px 100px;
    -moz-background-size:63px 100px; /* 老版本的 Firefox */
    background-repeat:no-repeat;
    padding-top:80px;
    }
    </style>
    </head>
    
    <body>
    <p>上面是缩小的背景图片。</p>
    
    <p>原始图片:<img src="/i/bg_flower.gif" alt="Flowers"></p>
    
    </body>
    </html>

    语法:

    background-size: length|percentage|cover|contain;
    描述测试
    length

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

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

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

    测试
    percentage

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

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

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

    测试
    cover

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

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

    测试
    contain 把图像图像扩展至最大尺寸,以使其宽度和高度完全适应内容区域。 测试
  • 相关阅读:
    java timer 指定某时间点执行
    java jdbc 同时操作查询删除操作
    java ResultSet获得总行数
    c# 根据枚举Value 获得名称
    c# 备份数据
    MySQL主从集群搭建
    单机安装MySQL多实例
    2019年度总结
    go goroutine id
    go语言中 json转换--nil
  • 原文地址:https://www.cnblogs.com/vickylinj/p/13156655.html
Copyright © 2011-2022 走看看