1. <div class="box">动画选框</div>
  1. .box{
  2. width:300px;
  3. height:100px;
  4. border:1px dotted #fff;
  5. border-image:url(data:image/gif;base64,R0lGODlhCAAIAJEAAP////8A/wAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCgABACwAAAAACAAIAAACDwwuGckJzR4UaEp423InFAAh+QQFCgABACwAAAAACAAIAAACD4wEGcuMvR6cC4hpaU0nFAAh+QQJCgABACwAAAAACAAIAAACEAwiYhvd56KKaErqYDwnrQIAOw==) 1 repeat;
  6. }

示例： 
http://codepen.io/puterjam/pen/gGLBj

【CSS3】好玩的动画线框的更多相关文章

  1. css3制作旋转动画

    现在的css3真是强大,之前很多动画都是用jq来实现,但是css3制作的动画要比jq实现起来简单很多,今天呢,我自己也写了一个css旋转动画和大家分享.效果如下面的图片 思路:1.制作之前呢,我们先来 ...

  2. CSS3中的动画效果记录

    今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...

  3. CSS3的自定义动画帧

    CSS3新增的动画帧非常绚丽,可以简单实现一些动画效果,目前除IE外各大主流浏览器都支持 本文演示三个:transform: scale3d(x, y, z)-缩放;.transform: trans ...

  4. CSS3中的动画功能（一）

    css3中的动画功能分为transitions功能和animations功能,这两种功能都可以通过改变css属性值来产生动画效果.今天带大家一起来看看css3动画功能中的transitions的用法. ...

  5. 3D Grid Effect – 使用 CSS3 制作网格动画效果

    今天我们想与大家分享一个小的动画概念.这个梦幻般的效果是在马库斯·埃克特的原型应用程序里发现的​​.实现的基本思路是对网格项目进行 3D 旋转,扩展成全屏,并呈现内容.我们试图模仿应用程序的行为,因此 ...

  6. 25个CSS3 渐变和动画效果教程

    随着最新版CSS3渐变和动画功能发布,Web开发者在开发的过程中有了更多的选择.实际上,已经有了一些替代的技术,目的都是使网站的建设变得简易,高效和快速.不过CSS3所提供的渐变功能有着显著的优点,特 ...

  7. 纯css3实现的动画加载条

    之前大大家分享了很多款加载条.今天给大家带来一款纯css3实现的动画加载条. 这款加载条适用浏览器:360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. 不支持IE8 ...

  8. 纯css3实现的动画加载特效

    之前给大家带了很多款进度加载条,今天再给大家分享一款纯css3实现的动画加载特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="wrap& ...

  9. 分享9款极具创意的HTML5/CSS3进度条动画

    1.HTML5/CSS3图片加载进度条 可切换多主题 今天要分享的这款HTML5/CSS3进度条模拟了真实的图片加载场景,插件会默认去从服务器下载几张比较大的图片,然后让该进度条展现当前读取图片的进度 ...

随机推荐

  1. LeetCode（35） Search Insert Position

    题目 Given a sorted array and a target value, return the index if the target is found. If not, return ...

  2. FFmpeg编译：jni not found 的问题

    进入Android\Sdk\ndk-bundle\platforms\android-xx\arch-arm\usr目录查看发现与Google官方下载的NDK相比缺少include目录 此目录下包含各 ...

  3. FLINK 案例分析

    基于Flink流处理的动态实时超大规模用户行为分析 https://zhuanlan.zhihu.com/p/31548501 基于Flink流处理的动态实时超大规模用户行为分析 https://zh ...

  4. (原创)c++11改进我们的模式之改进观察者模式

    和单例模式面临的是同样的问题,主题更新的接口难以统一,很难做出一个通用的观察者模式,还是用到可变模板参数解决这个问题,其次还用到了右值引用,避免多余的内存移动.c++11版本的观察者模式支持注册的观察 ...

  5. Web服务器缓存

    前面提到的一些缓存技术都是有我们的动态才程序控制的,现在的web服务器功能越来越强大,常用的web服务器软件也都内置了缓存功能,下面我们就简单的说下服务器端缓存的应用. 首先,我们先来介绍一下URL映 ...

  6. 使用终端执行.app程序 for mac

    背景:打开Eclipse闪退,需要查看错误日志 问题:使用Terminal执行 ./Eclipse.app时,提示“no such file or directory” 解决方案:执行./Applic ...

  7. 笔记本貌似好了（HP 450 卡)

    2013年9月份在苏宁上 买了个HP450,配置应该算还勉强,i5, 4G, 照理说一般LOL,DOTA,应该还可以.但是经常在打完一盘后,切出来,卡的要命,一直没有解决,昨天晚上虚拟机切出来,更是, ...

  8. 【ARM】2410裸机系列－按键查询式控制led

    开发环境   硬件平台:FS2410 主机:Ubuntu 12.04 LTS LED灯原理图 按键原理图 按键的接线资源 KSCAN0 -> GPE11    KSCAN1 -> GPG6 ...

  9. Spring Boot项目配置RabbitMQ集群

    //具体参看了配置的源码 org.springframework.boot.autoconfigure.amqp.RabbitProperties //RabbitMQ单机 spring:   rab ...

  10. java算法---五家共井

    古代数学巨著<九章算数>中有这么一道题叫“五家共井,甲二绠(汲水用的井绳)不足,如(接上)乙一绠:乙三绠不足,如丙一绠: 丙四绠不足,如丁一绠:丁五绠不足,如戊一绠:戊六绠不足,如甲一绠, ...