在页面加载时使用css进行淡入效果

CSS转换可以用于允许文本段落在页面加载中淡入吗？

我真的很喜欢它的样子http://dotmailapp.com/并希望使用类似的效果使用CSS。

注：该域名已被购买，不再具有上述效果。可以查看存档副本。浅谈回车机.

插图

具有此标记：

<div id="test">    
    <p>This is a test</p></div>

使用以下CSS规则：

#test p {
    opacity: 0;
    margin-top: 25px;
    font-size: 21px;
    text-align: center;
    -webkit-transition: opacity 2s ease-in;
    -moz-transition: opacity 2s ease-in;
    -o-transition: opacity 2s ease-in;
    -ms-transition: opacity 2s ease-in;
    transition: opacity 2s ease-in;}

如何在加载时触发转换？

慕标琳琳

浏览 1518回答 3

3回答

桃花长相依

关于如何在没有jQuery的情况下进行转换的问题。一个非常简单的例子。如果我有时间再想一想，我可能会完全消除javascript：<style>body {     background-color: red;     transition: background-color 2s ease-in;}</style><script>window.onload = function() {     document.body.style.backgroundColor = '#00f';}</script><body>     <p>test</p></body>

随时随地看视频慕课网APP