当前位置： 移动技术网 > IT编程>网页制作>CSS > 一款利用纯css3实现的超炫3D表单的实例教程

一款利用纯css3实现的超炫3D表单的实例教程

2019年07月25日  | 移动技术网IT编程  | 我要评论

　　今天要给大家分享一款纯css3实现的超炫3d表单。该特效页面的加载的时候3d四十五度倾斜，当鼠标经过的时候表单动画回正。效果非常炫，一起看下效果图：

　　实现的代码。

　　html代码：

xml/html code复制内容到剪贴板
  1. <div id="face">  
  2.         <div id="content">  
  3.             <p>  
  4.                 <input type="text" placeholder="name" /></p>  
  5.             <p>  
  6.                 <input type="text" placeholder="email" /></p>  
  7.             <p>  
  8.                 <textarea placeholder="comments"></textarea></p>  
  9.             <p>  
  10.                 <input type="button" value="submit" /></p>  
  11.         </div>  
  12.     </div>  

　　css3代码：

css code复制内容到剪贴板
  1. <div id="face">   
  2.         <div id="content">   
  3.             <p>   
  4.                 <input type="text" placeholder="name" /></p>   
  5.             <p>   
  6.                 <input type="text" placeholder="email" /></p>   
  7.             <p>   
  8.                 <textarea placeholder="comments"></textarea></p>   
  9.             <p>   
  10.                 <input type="button" value="submit" /></p>   
  11.         </div>   
  12.     </div>  

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网