美文网首页WEB前端程序开发
跟高老师学习Web前端之45.

跟高老师学习Web前端之45.

作者: 火色石榴花 | 来源:发表于2017-01-14 01:00 被阅读0次

           今天主要学习了盒子阴影-box shadow属性。

    代码书写1 代码书写2

            box-shadow:5px 5px rgba(0,0,0,.6);其中第一个5PX代表x轴向右的偏移量,第二个5px代表y轴向下的偏移量,“rgba”使用红、绿、蓝三种颜色的叠加来表示颜色,a表示透明度,取值0-1之间,值越大阴影部分越清晰。

            box-shadow:5px 5px  5px rgba(0,0,0,.6);第三个值表示阴影部分的模糊度,不能为负值,且值越大越模糊。

            box-shadow:5px 5px  5px  10px rgba(0,0,0,.6);第四个值表示设置阴影的外延值,外延值可以为负值,但负值的绝对值必须小于X轴或Y轴中最小的值。

            box-shadow:5px 5px  5px  1px rgba(0,0,0,.6) inset;指设置对象阴影为内阴影。

            box-shadow:0 0 5px 3px rgba(255,0,0,.6),表示红黄绿三种颜色交互作用的显示。

    页面展示

              以上就是今天所学内容。

    相关文章

      网友评论

        本文标题:跟高老师学习Web前端之45.

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