使用 CSS 过渡在页面加载时创建淡入效果
是否可以使用 CSS 过渡对文本进行淡入淡出效果当页面加载时？
要实现这种淡入效果，请合并以下 CSS 规则：
<h1>test p {</h1><p>margin-top: 25px;<br> font-size: 21px;<br> text-对齐：居中；<br> 不透明度：0；<br> 过渡：不透明度 2s escape-in;<br>}<br>现在，要在加载时触发转换，您可以使用以下方法之一：
方法1：CSS动画（不广泛支持)
</p><h1>测试 p {</h1><p>动画：淡入 2s;<br>}</p><p>@keyframes fadein {<br> 来自 { 不透明度：0; }<br> 至 { 不透明度：1; }<br>}<br>方法 2：jQuery 或 JavaScript
在文档加载时执行以下 jQuery 脚本：
<br>$("#test p").addClass("load");<br>使用相应的CSS：
</p><h1>测试 p {</h1><p>过渡：不透明度 2 秒缓入；<br> 不透明度： 0;<br>}</p><h1>测试 p.load {</h1><p>不透明度: 1;<br>}<br>方法 3 : 使用 jQuery 的 Deferred动画
延迟触发动画并设置持续时间：
<br>$("#test p").delay(1000).animate({不透明度: 1 }, 700);<br>请注意，不同的方法可能提供不同级别的跨浏览器兼容性，如所提供的响应中所述。
以上是CSS 过渡可以在页面加载时创建淡入效果吗？的详细内容。更多信息请关注PHP中文网其他相关文章！
