CSS3动画悬停显示文字特效代码下载



12 44 15



特效描述:CSS3 动画悬停 显示文字,CSS3动画悬停显示文字特效代码下载

代码结构

1. 引入CSS

<link rel="stylesheet" href="hover.css">

2. HTML代码

<div class="wrap">
  <div class="tile">
    <div class="text">
      <h1>Lorem ipsum.</h1>
      <img src="a.png">
      <h2 class="animate-text">More lorem ipsum bacon ipsum.</h2>
      <p class="animate-text">Bacon ipsum dolor amet pork belly tri-tip turducken, pancetta bresaola pork chicken
        meatloaf. Flank sirloin strip steak prosciutto kevin turducken. </p>
      <div class="dots"> <span></span> <span></span> <span></span> </div>
    </div>
  </div>
  <div class="tile">
    <div class="text">
      <h1>Lorem ipsum.</h1>
      <img src="b.png">
      <h2 class="animate-text">More lorem ipsum bacon ipsum.</h2>
      <p class="animate-text">Bacon ipsum dolor amet pork belly tri-tip turducken, pancetta bresaola pork chicken
        meatloaf. Flank sirloin strip steak prosciutto kevin turducken. </p>
      <div class="dots"> <span></span> <span></span> <span></span> </div>
    </div>
  </div>
  <div class="tile">
    <div class="text">
      <h1>Lorem ipsum.</h1>
      <img src="c.png">
      <h2 class="animate-text">More lorem ipsum bacon ipsum.</h2>
      <p class="animate-text">Bacon ipsum dolor amet pork belly tri-tip turducken, pancetta bresaola pork chicken
        meatloaf. Flank sirloin strip steak prosciutto kevin turducken. </p>
      <div class="dots"> <span></span> <span></span> <span></span> </div>
    </div>
  </div>
  <div class="tile">
    <div class="text">
      <h1>Lorem ipsum.</h1>
      <img src="d.png">
      <h2 class="animate-text">More lorem ipsum bacon ipsum.</h2>
      <p class="animate-text">Bacon ipsum dolor amet pork belly tri-tip turducken, pancetta bresaola pork chicken
        meatloaf. Flank sirloin strip steak prosciutto kevin turducken. </p>
      <div class="dots"> <span></span> <span></span> <span></span> </div>
    </div>
  </div>
</div>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滑动 滑块 滑动门 触屏滑动 滑动插件 滑块插件 加载动画 滑动星星打分 收缩展开 展开收缩 收缩 展开 h5弹窗动画 html5弹窗动画 h5动画 h5背景动画 h5场景动画 h53D动画 h5界面动画 html5动画 其他 h5按钮动画 html5按钮动画 鼠标悬停 文字收缩展开 文字收缩 文字展开 h5文字动画 h5文字边框动画 html5文字动画 html5文字边框动画 文字滑动 文字滑块

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到