我也要用
CSS
多啦薯片
那不是我的月亮，但有一刻，月光确实照在了我的身上
展开
-
原创 Font Awesome
Font Awesome是一套图标字体库和CSS框架，提供了丰富的矢量字体图标，不依赖JS，通过CSS可以控制所有图标的大小、颜色和阴影，可以Bootstrap等框架一起使用，Font Awesome中文兼容IE7+，完全免费。2017-04-17 16:38:08
424
0
-
原创 HTML+CSS37 镂空遮罩
前一阵子面试被问题到这个问题，突然懵逼了，脑子一片空白，以前知道这种效果，比如什么值得买的改版引导页面：当时再紧张也应该打出一种实现方法，就是什么值得买这种使用图片实现它首先加了一个半透明的黑色蒙层（background-color: rgba(0,0,0,.8)）然后添加提前制作好的图片作为子元素，然后通过决定定位，让图片与被遮盖的部分的定位相同，制造出一种假的镂空的效果虽然这种方式处...2019-08-19 11:36:43
2113
0
-
原创 HTML+CSS35 可替换元素
为何img、input等内联元素可设置宽高？2019-08-14 10:21:49
266
0
-
原创 HTML+CSS32 FOUC
什么是FOUCFOUC，Flash Of Unstyled Content，中文名称无样式内容闪烁。就是当浏览器在解析一个网页的时候，会出现的内容样式闪烁的现象。具体的过程是，当页面加载渲染时，首先以样式A渲染，当页面加载渲染完成时，页面突然改为由样式B渲染，导致出现页面样式闪烁。原理为什么会出现FOUC呢？这和浏览器渲染页面的流程机制有关系：（1）浏览器会首先构建DOM树，（2）处理...2019-05-14 09:57:34
122
0
-
原创 HTML+CSS31 网页换肤
常规做法1一个全局class来控制样式，切换皮肤时通过更改全局样式来实现换肤：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link href="../styles/base.css...2019-05-13 22:24:30
511
0
-
原创 32 BFC原理
定义BFC（Block Formatting Context – 块级格式化上下文）是布局过程中生成会块级合资的区域，也是浮动元素与其他元素的交互限定区域。BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。在一个块格式化上下文中，盒在竖直方向一个接一个地放置，从包含块的顶部开始。两个兄弟盒之间的margin不会合并，属于同一个BFC的块级元素之间的...2018-12-13 16:24:19
47
0
-
原创 动画06 绕圆心运动的小球
效果准备首先写出基本的CSS布局.outer-circle { margin: 50px auto; width: 300px; height: 300px; text-align: center; border-radius: 100%; background: palegoldenrod; position: relative;}.circle { ...2018-12-03 10:59:56
1099
0
-
原创 Vue中实现文字向上滚动的动画效果
在Vue中实现文字向上滚动的效果2018-06-27 18:25:33
39038
17
-
原创 清除浮动
一个误区<div class="left">左侧</div><div class="right">右侧</div><div class="bottom">底部</div>.left { float: left; width: 1000px; heigh2018-04-03 12:07:10
60
0
-
原创 图片Base64编码
什么是图片Base64编码图片的 base64 编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址。这样的意义是：网页上的每一个图片，都要消耗一个http请求下载而来（所以CSS雪碧图技术应运而生），而将图片编码成为base64格式可以随着html下载的同时下载到本地，从而节省了一次http请求2017-12-19 16:41:43
1907
0
-
原创 文字横向滚动效果
利用JS和CSS3两种方法实现文字横向滚动效果2017-11-03 14:54:34
4684
3
-
原创 CSS中的层叠效果
引言在 HTML 中 DOM 节点正常来说是后面出现的会覆盖在前面出现的上面，现在要求不适用z-index要实现这样的一个效果2017-10-19 16:08:54
3689
0
-
原创 pointer-events
pointer-events2017-07-12 15:04:02
249
0
-
原创 animate.css + jquery-aniview
animate.css + jquery-aniview2017-06-19 16:47:09
1647
2
-
原创 几个关于换行的属性
text-overflow + word-break + white-space + word-wrap2017-04-26 16:19:42
2657
0
-
原创 CSS Modules
CSS Modules2017-05-15 18:53:22
674
0
-
原创 切图小技巧
切图小技巧2017-05-15 18:52:08
602
0
-
原创 HTML+CSS07 瀑布流布局
预备知识：Column布局CSS Columns（多列布局）是一种定义了多栏布局的模块，它能够表现出将内容在列之间怎么流动的以及间隙和分割线怎么使用。浏览器的兼容性还是不错的，生产环境建议-moz和-webkit前缀以及不加前缀三种形式共同使用columnsCSS多列布局可以轻松的实现多列的瀑布流布局，它的两个关键属性是column-count和cloumn-widthcolumn-co...2019-08-13 10:44:41
3017
0