为了账号安全,请及时绑定邮箱和手机立即绑定
  • transform 图形转换
    查看全部
    0 采集 收起 来源:翘边阴影

    2016-07-27

  • box-shadow 参数应用
    查看全部
    0 采集 收起 来源:box-shadow讲解

    2016-07-27

  • 重叠阴影,加深效果
    查看全部
    0 采集 收起 来源:曲线阴影

    2016-07-24

  • .affect:after{<br> content:'插入的内容(内容/attr/url)';<br> }<br> .affect:boefore{<br> content:'插入的内容(内容/attr/url)';<br> }
    查看全部
  • box-shadow属性值
    查看全部
    0 采集 收起 来源:box-shadow讲解

    2016-07-24

  • 曲线阴影:<br> 位置的定位:主阴影 position:relative;<br> 其他阴影:position:absolute; 其他阴影的设置:content:''; width:; height:; 另外一种位置的设置方法: top:50%; bottom;; left:; right:; border-radius:100px/10px; 水平100px 垂直10px
    查看全部
    0 采集 收起 来源:曲线阴影

    2018-03-22

  • .affect:after{<br> content:'插入的内容(内容/attr/url)';<br> }<br> .affect:boefore{<br> content:'插入的内容(内容/attr/url)';<br> }
    查看全部
  • 曲线投影(多个阴影的重合 主投影+其他阴影) 翘边投影
    查看全部
    0 采集 收起 来源:原理分析

    2016-07-11

  • inset内阴影
    查看全部
  • :after 与 :before 用法
    查看全部
  • TWT
    box-shadow: h-shadow v-shadow blur spread color inset 参数 h-shadow(必需) 水平阴影的位置,允许负值 v-shadow(必需) 垂直阴影的位置,允许负值 blur(可选) 模糊距离 spread(可选) 阴影的尺寸 color(可选) 阴影的颜色,请参阅CSS颜色值 inset(可选) 将外部阴影(outset)改为内部阴影
    查看全部
    0 采集 收起 来源:box-shadow讲解

    2016-06-07

  • box-shadow 参数
    查看全部
    0 采集 收起 来源:box-shadow讲解

    2016-06-07

  • 本身直角阴影包括:底边直角阴影和内边直角阴影 翘边阴影是需要给盒子做变换的,翘边阴影盒子变换成平行四边形的宽度比直角阴影盒子的大,所以需要设置width;90%;因为阴影距顶部还有点距离所以设置height;80%; 用transform:skew(-10deg) rotate(-4deg);使翘边阴影盒子变为平行四边形且做旋转变换,然后将其背景色设置为透明background:transparent;同时记得将其z-index设置为负值,li的背景要设置成白色(因为翘边阴影盒子有阴影)
    查看全部
    1 采集 收起 来源:翘边阴影

    2016-05-25

  • 曲线阴影效果=1个直角阴影+2个重叠的曲线阴影(2个重叠的曲线阴影要放在直角阴影的下面); 正投影与圆角阴影重叠需要设置定位,相对定位元素为父元素effect 要让曲线投影这个盒子有一个尺寸,要么直接设置宽和高,要么对四个方向的值进行设置(浏览器会自动计算该盒子应有的大小,一定要是四个方向的值) 曲线阴影实质是圆角的阴影,所有曲线阴影盒子要设置border-radius;100px/10px;分别代表水平方向半径和垂直方向半径 让曲线阴影盒子位于下方的办法是设置z-index(=-1)小于直角阴影盒子 曲线投影不实的问题:与透明度关系不大,所以调节透明度影响不大。好的办法是让两个投影重叠在一起,即在直角阴影盒子内容的前面:before和后面:after都插入曲线投影盒子(都有绝对定位和且位置都是一样)
    查看全部
    3 采集 收起 来源:曲线阴影

    2016-05-24

  • 设置box-shadow时注意浏览器兼容性 X与Y阴影偏移量设为0 然后阴影就能从四个边同时显示
    查看全部

举报

0/150
提交
取消
课程须知
本课程适合有 (X)HTML 和 CSS2 基础及对 HTML5 和 CSS3 有所了解的童鞋们。
老师告诉你能学到什么?
1、如何分析阴影的层叠关系 2、如何使用 box-shadow 属性实现不同角度不同位置的内投影及外投影 3、如何使用 transform 变换中的 skew 与 rotate 实现斜边与曲线效果 4、如何使用 :after 与 :before 生成内容

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!