css3
关注
分享
扫一扫
花花最美腻
努力中
展开
-
钟表例子（css3/画布）
神奇的canvas<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> *{ m原创 2018-06-03 11:46:12 · 369 阅读 · 0 评论 -
转载-css 属性clip-path之多边形polygon小窥
原文http://www.cnblogs.com/leegao/p/4384499.html转载 2018-06-30 11:59:39 · 6197 阅读 · 0 评论 -
css3照片特效阴影（曲线投影和翘边投影）
主要语法1、实现阴影box-shadow: h-shadow v-shadow blur spread color inset参数： h-shadow (必需)：水平阴影的位置。允许负值。 v-shadow (必需)：垂直阴影的位置。允许负值。 blur (可选)：模糊程度，值越大越模糊。 spread (可选)：阴影的尺寸。 color (可选)：阴影的颜色。请参阅...原创 2018-06-11 16:21:55 · 3946 阅读 · 0 评论 -
转载-CSS中强大的EM
W3CPLUS转载使用CSS也好久了，但一直都是在使用“px”来设置Web元素的相关属性，未敢使用“em”。主要原因是，对其并不什么了解，只知道一点概念性的东西，前段时间在项目中要求使用“em”作为单位设置元素，所以从头对“em”学习了一回。稍为有一点理解，今天特意整理了一份博文与大家一起分享，希望对童子们有些许的帮助。这篇教程将引导大家如何使用“em”来创建一个基本的弹性布局，从而学习其如何计算...转载 2018-06-10 11:48:13 · 205 阅读 · 0 评论 -
css3动画导航栏3D
源码网盘根据慕课网做的css3小特效导航栏，图标以不同方式显示页面布局<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel原创 2018-06-10 11:48:24 · 1314 阅读 · 0 评论 -
转载-css中关于transform、transition、animate的区别
会飞的鱼儿游css中关于transform、transition、animate的区别写动画经常会用到这几个属性，他们之间有什么区别呢？1.transform 每每演示transform属性的，看起来好像都是带动画。这使得小部分直觉化思维的人（包括我）认为transform属性是动画属性。而恰恰相反，transform属性是静态属性。它其实只是一个静态属性，需要配合transition和anim...转载 2018-06-24 10:17:09 · 432 阅读 · 0 评论 -
css3例子 奥运五环
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0;原创 2018-06-02 12:52:52 · 1235 阅读 · 0 评论 -
CSS3中常用字体图标库总结
[一勺烩]CSS3中常用字体图标库总结 - 靳洪飞的文章 - 知乎https://zhuanlan.zhihu.com/p/21910270字体图标以前网页上显示图标都是用切成小图片，然后根据不同场景作多个小图，通过JS来控制显示效果。 字图图标，顾名思义，就像使用通常的字体，可以设置字体颜色，大小等，不用在搞多张小图片，非常灵活。优点轻松的定义图标的颜色，大小，阴影，和任何与CSS相关的特性。更...转载 2018-06-08 21:41:13 · 9529 阅读 · 0 评论 -
旋转合并照片墙-特效照片墙
思路： 首先预加载照片，分大图小图两个循环预加载函数，共48张图片，count记录循环次数，count==48时执行loadSuccess()中代码。 先让照片显示在div中，然后定位隐藏在左上角，然后计算每张图片应该在的位置，设置其left和top。使用transition语法让他们动态显示，并且设置不同的延迟时间TransitionDelay让他们一张一张显示，并且有一个随机角度（...原创 2018-06-08 21:00:26 · 2905 阅读 · 0 评论 -
元素水平垂直居中（css/css3）
一、css实现1、margin<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> *{ m原创 2018-06-06 16:10:57 · 175 阅读 · 0 评论 -
css和css3弹性盒模型实现元素宽度（高度）自适应
一、css实现左侧宽度固定右侧宽度自适应1、定位<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>自适应</title> <style> *{原创 2018-06-06 16:01:59 · 9544 阅读 · 0 评论 -
旋转的立方体 css3
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0;原创 2018-06-03 14:56:06 · 176 阅读 · 0 评论 -
css实现自定义复选框-HTML特殊字符实现
主要使用HTML特殊字符实现（豆友贡献 https://www.douban.com/group/topic/28046629/），但是有兼容性问题，改进三次。图一交互图图二使用9744/9745，展示效果不错，使用css最少，但是vivo某一手机兼容性问题严重，显示错误（是个❌？？？，不晓得为什么）。图二使用2713，完全不可取的写法，样式哪里有问题改哪里，导致各个...原创 2019-01-04 19:24:13 · 1404 阅读 · 0 评论