zoukankan      html  css  js  c++  java
  • CSS3秘笈复习:第八章

    一、背景的所有属性:

    属性 作用 可选项
    1.background-image 定义一张图片 url(...)
    2.background-repeat 控制重复 no-repeat | repeat-X | repeat-Y
    3.background-position 固定图片位置 center | top|left | right
    4.background-attachment 固定图片位置 scroll | fixed
    5.background-origin 调整图片起点 border-box | padding-box | content-box
    6.bcakground-clip 限制背景图片的显示区域 border-box | padding-box | content-box
    7.background-size 控制背景图片尺寸 精确值 | contain | cover | 

    二、渐变色背景:

    1.线性渐变:

      例如:创建一种从左边以黑色开始到元素最右边以白色结束的线性渐变:

    background-image:linear-gradient(left,black,white);

    还可以使用一个程度值表示渐变的方向。例如:

    background-image:linear-gradient(45deg , rgb( 0 , 0 , 0) , rgb( 204 , 204 , 204) );

    2.径向渐变:

      例如:

    background-image:radial-gradient(red , blue );

    创建了一个适合元素高度和宽度的椭圆形,红色到蓝色的渐变。

    添加关键字circle还可以创建出圆形的渐变。

    background-image:radial-gradient(circle , red , blue);

    为了指明渐变的尺寸,可以使用以下4个关键字之一:

    (1)closest-side:渐变从中心点一直延伸到离中心点最近的那一边。

    (2)closest-corner:用于测量渐变的宽度。

    (3)farthest-side:用于测量圆形的半径,从它的中间点到元素最远的那一边的距离。

    (4)farthest-corner:用于测量原形的半径,从它的中间点到元素最远角的距离。

  • 相关阅读:
    在给定的区间上对每个数都开方 最后还是在一段上求和
    简单的覆盖问题,,通过覆盖的g不同 有这不同的价值 最后还是一段上求和
    codevs 3094 寻找sb4
    noi 04:网线主管
    codevs 1031 质数环
    codevs 1061 重复子串
    codevs 1204 寻找子串位置
    codevs 3223 素数密度
    各种用法
    codevs1073 家族
  • 原文地址:https://www.cnblogs.com/koto/p/5352664.html
Copyright © 2011-2022 走看看