做一个小网站(它仍在线下在记事本上构建它)我想知道当有人访问网站时我是否可以获取文本(当我放一个时可以显示图像)？我在这里看到了其他问题,但没有一个对我有用,今天才开始学习HTML!如果可能的话,我宁愿不使用java,因为我没有经验,谢谢!

  
  
  


  

    
Home
    
Our Routes
    
Contact
    
About
  
  
  
 HOME 
  
 Text Goes here
  

Joel.. 9

http://codepen.io/JTBennett/pen/GorVRL [你的网站有淡入淡出和动作] http://codepen.io/JTBennett/pen/BjpXRo [以下说明的例子]

这是一个例子.如果你希望它一次淡入所有HTML,则需要将div包裹在整个正文内容中.寻找这个:

你可以用CSS做很多事情,我已经使用了很多年了,我偶尔会学到一些东西.

所有动画命令都会出现在你的CSS中,如下所示:

@keyframes fadeIn
  to { 
     opacity: 1; }

然后你的div将有一个调用动画的类(@keyframes):

.fade-in {
  animation: fadeIn 1.0s ease forwards;
  [other div properties can be included here]
}

HTML将如下所示:

[content]

最后,您需要确保包含供应商代码以使其与所有浏览器兼容[这会增加相当多的代码,这就是为什么jQuery可以成为更好的选择]:

@keyframes fadeIn{
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-moz-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-o-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-ms-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

必须在CSS的div类中再次复制供应商代码:

.fade-in {
  animation: fadeIn ease 5s;
  -webkit-animation: fadeIn ease 5s;
  -moz-animation: fadeIn ease 5s;
  -o-animation: fadeIn ease 5s;
  -ms-animation: fadeIn ease 5s;
}

使用jQuery可以更快地实现效果,您可以在此处的其他答案中看到.

在你学会手工完成之后,如果你想节省一点时间,我建议你玩这个CSS3动画生成器:http: //cssanimate.com/

请确保您先了解它.

最后,这是jQuery执行类似功能的一个例子(虽然这次使用SVG而不是div,但是同样的过程):http: //codepen.io/JTBennett/pen/YwpBaQ

http://codepen.io/JTBennett/pen/GorVRL [你的网站有淡入淡出和动作] http://codepen.io/JTBennett/pen/BjpXRo [以下说明的例子]

这是一个例子.如果你希望它一次淡入所有HTML,则需要将div包裹在整个正文内容中.寻找这个:

你可以用CSS做很多事情,我已经使用了很多年了,我偶尔会学到一些东西.

所有动画命令都会出现在你的CSS中,如下所示:

@keyframes fadeIn
  to { 
     opacity: 1; }

然后你的div将有一个调用动画的类(@keyframes):

.fade-in {
  animation: fadeIn 1.0s ease forwards;
  [other div properties can be included here]
}

HTML将如下所示:

[content]

最后,您需要确保包含供应商代码以使其与所有浏览器兼容[这会增加相当多的代码,这就是为什么jQuery可以成为更好的选择]:

@keyframes fadeIn{
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-moz-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-o-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-ms-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

必须在CSS的div类中再次复制供应商代码:

.fade-in {
  animation: fadeIn ease 5s;
  -webkit-animation: fadeIn ease 5s;
  -moz-animation: fadeIn ease 5s;
  -o-animation: fadeIn ease 5s;
  -ms-animation: fadeIn ease 5s;
}

使用jQuery可以更快地实现效果,您可以在此处的其他答案中看到.

在你学会手工完成之后,如果你想节省一点时间,我建议你玩这个CSS3动画生成器:http: //cssanimate.com/

请确保您先了解它.

最后,这是jQuery执行类似功能的一个例子(虽然这次使用SVG而不是div,但是同样的过程):http: //codepen.io/JTBennett/pen/YwpBaQ