自行翻书特效，纯CSS+HTML
发表评论
效果见下： Felicity cool 你在闲逛 代码： 参考原文：www.html5tricks.com
标签归档：CSS
首页蜡烛代码
老版（无数字）： 新版（有数字）：
首页花瓣代码
CSS 背景位置 background-position属性
除了背景背景平铺外，CSS还提供了另一个强大的功能，即背景定位技术，能够精确控制背景在对象中的位置。 默认情况下，背景图像都是从元素 padding 区域的左上角开始出现的，但设计师往往希望背景能够出现在任何位置。通过 background-position属性，可以很轻松的控制背景图像在对象的背景区域中的起始显示位置。其语法格式为： background-position: xpos ypos | x% y% | x y CSS1中，background-position属性需要 2 个参数值，第一个值用于横坐标，第二个值用于纵坐标，默认值为 0% 0%，即背景图像的左上角与对象背景区域的左 […]
CSS实现垂直居中的几种方法
====== 目录 单行文本的居中 1.文字水平居中 2.文本垂直水平居中 二、多行文本的垂直居中 1.使用display:flex实现 2.使用display:-webkit-box实现 3.使用绝对定位和负边距 4.使用transform:translate定位 5.绝对定位和0 6.通过display:table-cell 正文回到顶部 单行文本的居中 1.文字水平居中 1 <div class=’box’ style=”text-align: center;”>hello world</div> 2.文本垂直水平居中 1 <div class=”box2″ […]
HTML+CSS+JS dTree 树形目录的使用
example 压缩包：https://pan.baidu.com/s/1DI2mM3iSnKtpkV45-gUzAA 提取码: m1pi 使用注意事项： 1）dtree.js里可以修改点击项目的操作 原js文件里的nodeSel和node的样式切换不生效，可以在点击方法里添加 也可在dTree官网查看学习dTree api使用
使用 CSS 渐变
CSS 渐变 <image> 类型的一种特殊类型 <gradient> 表示，由两种或多种颜色之间的渐进过渡组成。您可以选择三种类型的渐变：线性 (由 linear-gradient 函数创建)，径向(由 radial-gradient() 函数创建) 和圆锥 (由 conic-gradient 函数创建)。您还可以使用 repeating-linear-gradient 和 repeating-radial-gradient 函数 […]
CSS—display详解
inline 常用的inline就是文字和图片，其实inline真没什么好说的，大家可以把它想象成一个杯子里的水，它是“流”，是没有大小和形状的，它的宽度取决于父容器的宽度。 因此，针对inline的标签，你设置宽度和高度是无效的，通过监控可以知道，该元素实际的宽度和高度都是auto，并不是我们设定的值。 一个很基础的问题：如何把inline元素转换成“块”元素？相信绝大部分人的回答是display:block，但是你应该知道这不是一个唯一的答案。至少我设置display:table也是可以的吧？ […]
css-图片（img）的等比例自动缩放
img{ width: auto; height: auto; max-width: 100%; max-height: 100%; } 据父容器的自动缩放，并保持图片原来的比例。这样你设置父容器的大小就可以啦。
CSS设置文字不能选中
/*设置文字不能被选中 以下为css样式*/ -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;