集训第五天--移动端的一些知识

本文深入讲解了CSS单位rem的工作原理及应用,包括不同动画效果的实现方式,并介绍了HTML5的Canvas元素及其在JavaScript的帮助下如何绘制图像,涵盖了路径、圆形、矩形等多种图形的绘制方法。

rem是什么?

rem是相对于根元素html的大小 rem等于 实际字体的大小=根元素的字体大小*元素的rem

实现原理

rem的计算

rem=(设计稿中元素大小/设计稿的宽度)*10

5rem=(375px/750px)*10

5rem表示5/10=0.5 一半的大小

简单的css制作小三角形

高度和宽度必须为0

鼠标的几种不同的样式

css3的那些属性

linear 动画从头到尾的速度是相同的,匀速

ease 默认 动画以低速开始,然后加快,在结束前变慢

ease-in 动画以低速开始,然后加快,在结束前变慢

ease-out 动画以低速结束

ease-in-out 动画以低速开始和结束

steps()制定了时间函数中的间隔数量(步长)就是分几步来完成动画

实现打字机效果

canvas

html5的canvas元素使用在javascript在网页上绘制图像

画布是一个矩形区域 您可以控制每一个像素

canvas拥有绘制路径,圆形,矩形,字符以及添加图像的方法。

 

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值