透明度以及CSS3的新特性

本文介绍了CSS3中的透明度设置,包括opacity属性以及IE低版本的filter:alpha兼容写法。此外,详细讲解了CSS3过渡(transition)的四个要素:要过渡的属性、花费时间、运动曲线和何时开始,并列举了不同运动曲线的效果。同时提到了过渡延迟时间(transition-delay)的概念及其使用方法,包括正值、负值和默认值0s的应用场景。
摘要由CSDN通过智能技术生成

透明度:opacity:x;

x的值为0~1,值越小越透明 ,

可以写为opacity: .5;

ie低版本支持filter:alpha(opacity=x)

 x值为0~100,值越小越透明

CSS3过渡

transition:要过渡的属性 花费时间 时间曲线 何时开始;

1.属性:想要变化的CSS属性,宽度高度 背景颜色 内外边距都可以。如果想要所有的属性都变化过渡,写一个all就可以了。

2.花费时间:单位是秒(必须要写单位)比如2s

3.运动曲线: 默认是ease

4.何时开始:单位是秒(必须要写单位)可以设置延迟出发时间 默认是0s

运动曲线可以有以下属性:

transition:  all  2s  linear ;

linear  规定以相同速度开始至结束的过渡效果

transition: all 2s ease-in;

ease-in  规定以慢速开始的过渡效果 (一开始会很慢 后面快结束的时候会加快)

transition: all 2s ease-out;

ease-o

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值