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. Oozie-自定义实现WorkFlow中shell action

    拷贝默认的shell目录来进行修改 $ cp -r ./examples/apps/shell/ my-apps/ 定义job.properties nameNode=hdfs://bigdata-0 ...

  2. jquery JSON的解析方式实例分享

    本文以jquery异步获取的数据类型——json对象和字符串为依据,介绍两种方式获取到的结果处理方式. 这里考虑都考虑的是服务器返回的是JSON形式的字符串的形式,对于利用JSONObject等插件封 ...

  3. 菜鸟调错(三)——Jboss与jdk版本不兼容导致WebService调用出错

    环境: jdk1.6 Jboss 5.1.0.GA 问题描述: EJB发布webserivce已经成功,并且能够成功访问wsdl文件: 使用axis1自带的sample/client下的类Dynami ...

  4. docker容器资源配额控制

    转自:http://blog.csdn.net/horsefoot/article/details/51731543 文/ 天云软件 容器技术团队 Docker通过cgroup来控制容器使用的资源配额 ...

  5. Silverlight-MEF-DEMO

    “托管扩展性框架(Managed Extensibility Framework,简称MEF),是微软.NET框架下为提高应用和组件复用程度而推出的,用于使组件能够最大化的重用.使用MEF能够使静态编 ...

  6. 【ARM】2440裸机系列-图片显示

    功能 LCD显示字汉字,字符和图片 说明 汉字,字符和图片需要用相应的取模软件得到相应的c文件,然后包含到工程中 主要代码   1)绘制背景 void Brush_ U32 c) { int x,y ...

  7. 【论文笔记】多任务学习(Multi-Task Learning)

    1. 前言 多任务学习(Multi-task learning)是和单任务学习(single-task learning)相对的一种机器学习方法.在机器学习领域,标准的算法理论是一次学习一个任务,也就 ...

  8. Python(二)之对象类型

    本篇记录Python对象类型 开始仍然是先掌握几个查看对象有用的函数,id,type,print 查看对象身份.类型.值:记住以下两个命令id,type 两个对象的比较 以上三个分别是 身份比较.对象 ...

  9. Python nose单元测试框架的安装与使用

    [本文出自天外归云的博客园] 安装(Python2下安装) pip install nose 原理与命名规则 Nose会自动查找源文件.目录或者包中的测试用例,符合正则表达式(?:^|[\b_\.%s ...

  10. Ubuntu 16.04 搭建KVM环境

      在Ubuntu 16.04下搭建KVM环境过程记录. 1 查看CPU是否支持KVM egrep "(svm|vmx)" /proc/cpuinfo 有结果输出,如下图: 2 安 ...