今天小编给大家分享一下css3中transition的概念是什么的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我
今天小编给大家分享一下css3中transition的概念是什么的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一起来了解一下吧。
CSS3中transition是“过渡”的意思，是用于设置元素过渡效果的一个属性；该属性是一个简写属性，能够给元素添加一个过渡动画效果，通过参数可以设置过渡动画的相关操作，语法为“transition:属性名 时间 速度曲线 延迟时间”。
本教程操作环境：windows10系统、CSS3&&HTML5版本、Dell G3电脑。
transition在css3中是过渡的意思。
transition 属性设置元素当过渡效果
四个简写属性为：
transition-property
transition-duration
transition-timing-function
transition-delay
语法为：
transition: property duration timing-function delay;其中参数代表如下：
示例如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
div
{
width:100px;
height:100px;
background:red;
transition:width 2s;
-WEBkit-transition:width 2s;
}
div:hover
{
width:300px;
}
</style>
</head>
<body>
<p><b>注意：</b>该实例无法在 Internet Explorer 9 及更早 IE 版本上工作。</p>
<div></div>
<p>鼠标移动到 div 元素上，查看过渡效果。</p>
</body>
</html>输出结果：
以上就是“css3中transition的概念是什么”这篇文章的所有内容，感谢各位的阅读！相信大家阅读完这篇文章都有很大的收获，小编每天都会为大家更新不同的知识，如果还想学习更多的知识，请关注编程网VUE频道。
--结束END--
本文标题: css3中transition的概念是什么
本文链接: https://www.lsjlt.com/news/97506.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑，方便收藏和打印～
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
官方手机版
微信公众号
商务合作
0