css
清晏23
越努力,越平静
展开
-
Sass、Less 、Stylus 的三国演义(1)
古往今来,生产力的发展,推动着人类社会的进步。人类社会的进步,又主导了劳动工具的革新。 Css亦然,发展至今,Css3 已经普及,甚至Css 4 的规范,都已经在制定中。功能越来越强大,视觉越来越酷炫,但就开发者而言,开发维护的体验,却并未有明显提升。 这个时候,css 的各种劳动工具应运而生,Sass、Less、Stylus,像写 JQuery 一...原创 2018-07-31 17:56:59 · 157 阅读 · 0 评论 -
Css3动画 - 小圆围绕大圆的自转公转
一个面试题,题目:实现一个小圆围绕大圆转圈 例1】、先让她转起来,也就是自转:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>circle</title> <s原创 2018-11-13 17:39:25 · 3875 阅读 · 0 评论 -
Vue.js 换肤
思路: Less / Sass / Stylus ,定义多种皮肤对应的方法,点击皮肤颜色,切换最外层 div#app 的 class,来实现换肤。App.vue <template> <div id="app" :class="currentSkin"> <h1>title</h1> <div class=&quo原创 2018-09-25 11:21:26 · 503 阅读 · 0 评论 -
纯 Css 实现 ui-layout 布局
年初,公司 UI 框架升级,几番比较以后,layui 和 adminLte 同时入选。当然,很明显,这俩框架都是师出 bootstrap,提供基础的样式、组件、插件。但要‘本土化’到项目中来,多少要再翻炒一遍。公司的系统页,大多基于页面高宽100%来开发作业,以前的布局框架,无论是自己写的,还是插件,如ui-layout,都是用脚本计算。 现在,这俩新框架,栅格部分勉强...原创 2018-08-18 03:11:52 · 2005 阅读 · 0 评论 -
z-index 元素顺序 - 后宫甄嬛
先提三个问题:1、position 和 z-index 的默认属性是什么?希望你答对了!答案:position:static,z-index :auto剩下的两个问题:2、position 所有属性值,是否支持 z-index ?3、元素设置不同 position 属性值,重叠在一起,如何让其中任意一个在最上层?带着这些问题,今天,来挖一下 position 和 z-inde...原创 2018-08-25 12:09:39 · 466 阅读 · 0 评论 -
Flex 子元素高度塌陷
先看看页面整体布局:· wrap 弹性布局,分 head、main;· head 弹性布局,分 h2、i ;问题:head 高度塌陷。高 32px,变成:24.03px(PS里:chrome是23px,IE是24px)。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"...原创 2018-08-15 00:48:04 · 7281 阅读 · 1 评论 -
Css居中 - 极限挑战
说到居中,大部分人可能都觉得,这简直婴幼儿问题嘛,别说前端了,恐怕设计后端,都会不假思索地敲个:text-align:center; margin:0 auto; 那么问题来了,居中,你知道吗?你真的知道吗?你确定你知道吗?你真的确定你知道吗……哈哈,我都被这鸟广告烦死了! 那么今天,我们就一起来翻箱倒柜、温故知新!1、文字居中,文字和图标的垂直对齐: 暂时不表,后续...原创 2018-08-06 17:07:24 · 157 阅读 · 0 评论 -
Vue 手风琴 和 $set
最近,在开发项目的时候,要做一个手风琴,要求能**同时展开多个面板**,喏,也就是Element-ui 折叠面板这个型的:但需求是加了更改排序的功能,如下图,表现上自然不同了,先前提到的Element-ui折叠面板,满足不了,只能 DIY 一个。接着,啪叽一顿代码下来,大体如下。这里的方法是:给已有的数据对象添加新的属性。[color=#ff4753]*[/color]注...原创 2019-06-28 11:24:29 · 476 阅读 · 0 评论