CSS currentColor研究

【CSS currentColor研究】的更多相关文章

刚刚写了篇<CSS变量试玩儿>,我们了解到可以使用原生的CSS来定义使用变量,简化CSS书写.优化代码的组织与维护,但可怕的兼容性问题,又让我们望而却步.一笑了之. 但是有这么一个CSS变量currentColor,兼容良好.功能强大,接下来我们来一探究竟. 简介 CSS里已经有一个长期存在的兼容性良好的变量currentColor,表示对当前元素颜色的引用,可以应用在当前元素的其他属性和后代元素上. h1 { color: hsl(0,0%,44%); padding: 1rem; /* 这…

CSS深入研究:display的恐怖故事解密(2) - table-cell

上集<CSS深入研究:display的恐怖故事解密(1) - display-inline>已经把display的属性列表拉出来溜了,发现在这个属性恐怖面貌其实都是脆弱的伪装.除了部分常用属性外,其他的都是传说哥.既然是传说哥,请不要迷恋.就让传说继续传说着吧.这次我们来搞定table-cell这个货.(table-cell:IE6.7不支持) table-cell这个家伙在国外的网站中偶有露头,天朝由于IE6.7这两个货泛滥成灾,难有发挥,那么,这个家伙到底能干些什么呢?先让我们来研究下ta…

CSS深入研究:display的恐怖故事解密(2) - table-cell(转)

http://www.cnblogs.com/StormSpirit/archive/2012/10/24/2736453.html 上集<CSS深入研究:display的恐怖故事解密(1) - display-inline>已经把display的属性列表拉出来溜了,发现在这个属性恐怖面貌其实都是脆弱的伪装.除了部分常用属性外,其他的都是传说哥.既然是传说哥,请不要迷恋.就让传说继续传说着吧.这次我们来搞定table-cell这个货.(table-cell:IE6.7不支持) table-ce…

CSS彻底研究(3) - 浮动,定位

Github pages 博文 CSS彻底研究(3)-浮动,定位一 . 浮动float I . 定义及规则 float默认为none,对应标准流的情况.当float : left;时,元素就会向其父元素的左侧靠紧,脱离标准流,同时宽度不再伸展至充满父容器,而是根据自身内容来确定. II . 演示规则准备代码 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="…

CSS currentColor 变量的使用

CSS中存在一个神秘的变量,少有人知自然也不怎么为人所用.它就是crrentColor变量(或者说是CSS关键字,但我觉得称为变量好理解些). 初识它是何物?具有怎样的功效?它从哪里来?带着这些疑问我们继续. 下面是来自MDN的解释: currentColor代表了当前元素被应用上的color颜色值. 使用它可以将当前这个颜色值应用到其他属性上,或者嵌套元素的其他属性上. 你这可以这么理解,CSS里你可以在任何需要写颜色的地方使用currentColor这个变量,这个变量的值是当前元素的col…

css定位研究

css的定位是很重要的一个知识点,要学会网页布局,一定要先把定位弄清楚,今天抽空整理一下这方面的知识. 1.块级元素和行内元素(内联元素) 块级元素:display值为block的元素就是块级元素,比如div,h,p,table,块级元素会占据一定的矩形空间,通过设置width,height,padding,margin等来调整这个矩形框(也就是盒模型)的大小. 行内元素(内联元素):display的值为inline的元素为内联元素,这些元素本身不占据矩形空间,必须依附于块级元素而存在,所以给他…