[#rotate2D,#rotate3D { width: 80px; height: 70px; color: white; position:relative; font-weight:bold; font-size:15px; padding:10px; float:left; margin-... ...
分类：
Web程序 时间：
2020-07-05 13:26:25
阅读次数：
120
创建剪切动画 对于剪切动画，使用clip-path代替width/height，避免DOM重排导致性能过低。 .animate { width: 200px; height: 200px; background: #000; animation: 1s clip; } @keyframes clip ...
分类：
Web程序 时间：
2020-07-05 00:17:01
阅读次数：
77
box-sizing属性用来定义元素的width和height所表示的区域,该属性一般有三种值：content-box、border-box、inherit。其中inherit表示box-sizing的值应该从父元素继承。content-box和border-box的主要区别就是元素的width和h ...
分类：
Web程序 时间：
2020-07-04 01:17:58
阅读次数：
91
在设计图会经常使用到的阴影效果，如何用css3来实现呢？这篇文章主要整理box-shadow的一些好看常用的投影效果。 1、曲面/椭圆投影效果: 代码如下： <style> .shadow_wrap{ width: 100%;background:#E6EEF6;max-width: 600px;m ...
分类：
Web程序 时间：
2020-07-03 21:37:09
阅读次数：
166
当我们在浏览一些网站时发现，里面含有一些十分个性的字体，这些字体并不是我们电脑上安装的字体。那么css是如何实现自定义字体的呢？ 资源网站大全https://55wd.com 在css3中可以通过@font-face模块，把自己定义的Web字体嵌入到你的网页，web设计师可以使用他们喜欢的任意字体， ...
分类：
Web程序 时间：
2020-07-03 21:27:10
阅读次数：
86
为什么要写自适应的页面（响应式页面）？ 众所周知，电脑、平板、手机的屏幕是差距很大的，假如在电脑上写好了一个页面，在电脑上看起来不错，但是如果放到手机上的话，那可能就会乱的一塌糊涂，这时候怎么解决呢？以前，可以再专门为手机定制一个页面，当用户访问的时候，判断设备是手机还是电脑，如果是手机就跳转到相应 ...
分类：
Web程序 时间：
2020-07-03 19:19:56
阅读次数：
214
有一些网页中,有时候会碰到饼状图的需求，比如统计图表，进度指示器，定时器等，实现方式也是各种各样，现在也有不少现成的js库，可以直接拿来使用，方便很多。这里笔者为大家演示一种纯css实现饼状图效果的方法。 资源网站大全 https://55wd.com <div class="pie"></div> ...
分类：
Web程序 时间：
2020-07-03 12:43:44
阅读次数：
93
Bootstrap进度条组件详解 首先需要导入相关bootsrap的组件包：bootstrap.min.css、jquery.min.js、bootstrap.min.js 等，这个就不多说了 在网页中，进度条的效果并不少见，如：平分系统、加载状态等，进度条组件使用了css3的transition和 ...
分类：
其他好文 时间：
2020-07-03 10:27:12
阅读次数：
39
利用hover控制动画，一个从反面向正面翻，一个从正面向反面翻。 利用：backface-visibility: hidden;控制反面的元素不显示。 不支持的浏览器直接切换层级换图（部分ie9模拟器不支持） <!DOCTYPE html> <html lang="en"> <head> <meta ...
分类：
Web程序 时间：
2020-07-01 13:02:03
阅读次数：
85
在网页进行css布局时居中是经常需要用到的，其中就有css绝对定位居中，那么，css绝对定位如何实现居中？今天的这篇文章将给大家来介绍关于css绝对定位居中的实现方法。 css绝对定位居中的实现方法有很多，下面将给大家介绍css绝对定位居中的四种方法。 前端10K面试准备，最完整面试真题分享（含答案 ...
分类：
Web程序 时间：
2020-06-30 20:41:33
阅读次数：
55
