一个css3的高效变量currentColor,能够继承(父级)当前字体的颜色属性(代表当前的标签所继承的文字颜色)。

参考demo:http://www.zhangxinxu.com/study/201410/background-hollow-currentcolor.html

文章来自:currentColor-CSS3超高校级好用CSS变量

css3之currentColor的更多相关文章

  1. 你用过CSS3的这个currentColor新属性吗?使用与兼容性

    currentColor顾名思意就是“当前颜色”,准确讲应该是“当前的文字颜色”,例如: .xxx { border: 1px solid currentColor; } currentColor表示 ...

  2. 用神奇的currentColor制作简洁的颜色动画效果

    先上一个兼容性总结图:老版本ie可以直接用复杂方法了,套用某表情包的话:  2016年了,做前端你还考虑兼容IE6?你这简直是自暴自弃! 好了,知道了兼容性,我们可以放心的使用了. 在CSS3中扩展了 ...

  3. CSS3与页面布局学习总结(二)——Box Model、边距折叠、内联与块标签、CSSReset

    一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...

  4. CSS3与页面布局学习笔记(二)——盒子模型(Box Model)、边距折叠、内联与块标签、CSSReset

    一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...

  5. 总结CSS3新特性(颜色篇)

    颜色: CSS3新增加了hsl(), hsla(), rgb(),rgba()四个函数来创建color值; hsl(): hsl函数:h(色调),s(饱和度),l(亮度); 色调:为0-360之间的数 ...

  6. 【转】CSS3 transition规范的实际使用经验

    原文转自:http://blog.jobbole.com/56243/ 本篇文章主要讲述CSS3 transition规范和在不同浏览器之间的使用差异,关于具体解决方法或如何规避问题的意见可以参考另一 ...

  7. CSS3 transition规范的实际使用经验

    本篇文章主要讲述CSS3 transition规范和在不同浏览器之间的使用差异,关于具体解决方法或如何规避问题的意见可以参考另一篇非常有见地的文章,“All You Need to Know Abou ...

  8. css3绘制几何图形

    用css3绘制你需要的几何图形 1.圆形 示例: 思路:给任何正方形元素设置一个足够大的 border-radius ,就可以把它变成一个圆形.代码如下: html: <div class=&q ...

  9. 超绚丽CSS3多色彩发光立方体旋转动画

    CSS3添加了几个动画效果的属性,通过设置这些属性,可以做出一些简单的动画效果而不需要再去借助JavaScript.css3动画的属性主要分为三类:transform.transition以及anim ...

随机推荐

  1. webkit模块介绍

    一.Webkit模块   用到的第三方库如下:   cairo 一个2D绘图库 casqt Unicode处理用的库,从QT中抽取部分代码形成的 expat 一个XML SAX解析器的库 freety ...

  2. [Angularjs]ng-repeat中使用ng-model遇到的问题

    写在前面 在ng-reapet中如何为ng-model双向绑定呢?在项目中确实遇到这样的问题,绑定了,但是在controller中获取不到它的值,确实挺奇怪的. 系列文章 [Angularjs]ng- ...

  3. hdu 2048 神、上帝以及老天爷

    经典错排问题,算出n个人的排列可能,即求n!. 在本题中设定所有人即n个人全部拍错,即求n错排. 要求:求出其全部错排发生的概率 n错排 / n! * 100  以小数形式输出即可. #include ...

  4. WebSocket 是什么原理?为什么可以实现持久连接?

    https://www.zhihu.com/question/20215561   作者:Ovear链接:https://www.zhihu.com/question/20215561/answer/ ...

  5. eclipse-统计代码行数

    使用Eclipse可以方便的统计工程或文件的代码行数,方法如下: 1.点击要统计的项目或许文件夹,在菜单栏点击Search,然后点击File...  2.选中正则表达式(Regular express ...

  6. 转 Xenserver HVM is required for this operation的解决办法

    今天在XenServer中安装虚拟机时出现如下错误: 原因:没有开启XenServer服务器主机的虚拟化支持功能 解决办法:在XenServer主机的BIOS里开启CPU的虚拟化支持功能 本文出自 “ ...

  7. 导出Excel之Epplus使用教程4(其他设置)

    导出Excel之Epplus使用教程1(基本介绍) 导出Excel之Epplus使用教程2(样式设置) 导出Excel之Epplus使用教程3(图表设置) 导出Excel之Epplus使用教程4(其他 ...

  8. POJ 2513 Colored Sticks

    Colored Sticks Time Limit: 5000MS   Memory Limit: 128000K Total Submissions: 28036   Accepted: 7428 ...

  9. HDU 1029 Ignatius and the Princess IV

    解题报告: 题目大意:就是要求输入的N个数里面出现的次数最多的数是哪一个,水题.暴力可过,定义一个一位数组,先用memset函数初始化,然后每次输入一个数就将下标对应的上标对应的那个数加一,最后将整个 ...

  10. ruby Errors & Exceptions

    When you first started coding, errors were probably the last thing you wanted to see. After all, it’ ...