你的位置:首页 > 软件开发 > 网页设计 > HTML5+CSS实现图片过滤特效

HTML5+CSS实现图片过滤特效

发布时间:2015-12-16 16:00:11
基于HTML5+CSS实现图片过滤特效是一款类似Instagram应用的图片过滤特效。效果图如下:在线预览 源码下载实现的代码。html代码:<fieldset class="demo__option-field"> ...

基于HTML5+CSS实现图片过滤特效是一款类似Instagram应用的图片过滤特效。效果图如下:

HTML5+CSS实现图片过滤特效

在线预览    源码下载

实现的代码。

html代码:

<fieldset class="demo__option-field">       <legend>Choose a sample image:</legend>       <img class="demo__option-img" src='/images/loading.gif' data-original="img/1.jpg" >       <img class="demo__option-img" src='/images/loading.gif' data-original="img/atx.jpg" >       <img class="demo__option-img" src='/images/loading.gif' data-original="img/tahoe.jpg" >       <img class="demo__option-img" src='/images/loading.gif' data-original="img/bike.jpg" >       <img class="demo__option-img" src='/images/loading.gif' data-original="img/lakegeneva.jpg" >       <br>       <label class="demo__input-label">         Or paste in a link to your own photo:         <input class="demo__input-img" type="text">       </label>     </fieldset>     <small class="demo__note">Hovering over any of these images (or clicking on mobile) will remove the filter effect to visualize the changes.</small>

原标题:HTML5+CSS实现图片过滤特效

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。