本节简介:讲解css3的圆角、阴影、旋转、缩放、以及速率等属性值
本节课同学们做的笔记 点击播放按钮可自动定位到对应时间进行播放
做图像,让图像放大是: xxx:hover img(注意是用让图像放大,所以定义是img)
缩放属性:transform:scale(x)(单位默认是倍数,不用写单位,输入>!的值是放大,<1的是缩放)
旋转属性:transform:rotate(旋转度数)(单位是)deg
文字阴影:text-shadow:其他属性和 box-shadow 设置一样
长方形圆弧按钮设置 border-radius:(高度的一半)px
圆角属性:border-radius:Xpx 如果想要正方形变成一个圆形,只需要设置 border-radius:50%
既要内阴影又要外阴影: 在 inset后面加个逗号再把前面数据复制过来, -------- inset,--------
阴影效果:box-shadow:X轴的偏移 Y轴偏移 模糊的范围 阴影的扩展 阴影的颜色 内阴影
border-radius:50% ----- 正方形变圆形
阴影可以加多个,每一组阴影属性值 的后面加逗号,再写另一级阴影值即可;
box-shadow:x轴偏移 y轴偏移 模糊的范围 阴影的扩展 阴影的颜色 内阴影
transform:rotate(45deg)旋转45度 box-shadow:阴影
box-shadow:{X偏移 Y偏移 羽化值 阴影颜色}
transform变换;transform:rotate(45deg);旋转45度;transform:scale(1.5);放大1.5倍;