文章关键字 ‘选择器’

快速了解CSS新出的列选择符双管道(||)

2019年02月11日,星期一

列选择符封图

列选择符是规范中刚出现不久的新选择符,写作双管道||,是两个字符,和JavaScript语言中的逻辑或写法一致,这个选择符可以让选择所有属于某一列的对应单元格,哪怕这个单元格元素横跨多列。

阅读全文…

周知:CSS -webkit-伪元素选择器不再导致整行无效

2018年12月17日,星期一

-webkit-与伪元素

通常,如果选择器链或组中有无效的伪元素或伪类,则整个选择器列表无效。如果伪元素(但不是伪类)具有-webkit-前缀,那么对于Firefox 63+,Blink、Webkit和Gecko浏览器认为它是有效的,而不会使选择器列表无效。

阅读全文…

CSS :visited伪类选择器隐秘往事回忆录

2018年10月12日,星期五

头图

CSS :visited伪类选择器你以为很简单,麻鸭,估计是所有伪类选择器里面最不简单,最怪异的了。很多奇怪的特性你想都想不到,进来看看,一定会有别样的收获的。

阅读全文…

AMCSS(CSS属性模式)开发简介

2018年03月25日,星期日

AMCSS是Attribute Modules for CSS的缩写,表示借助HTML属性来进行CSS相关开发。传统我们多个模块特性是通过多个类名进行控制的,而AMCSS则是基于属性控制……

阅读全文…

CSS3 :default伪类选择器简介

2018年03月15日,星期四

CSS3 :default伪类选择器作用设计的作用是让用户在选择一组数据的时候,依然知道默认选项是什么,否则其他选项一多,选着选着就不知道默认提供的是哪个了,算是一种体验增强策略。作用不是很强烈,但是关键时刻却很有用。

阅读全文…

CSS :focus-within伪类选择器及纯CSS下拉等应用举例

2018年01月21日,星期日

:focus-within伪类原本设计的作用是原生表单元素focus时候,祖先<form>元素可以也有状态变化。

但是在我看来,:focus-within功能之强悍,远远不是仅仅和祖先<form>元素玩过家家这么简单。

理论上,只要页面上任意一个元素focus,通过:focus-within就能对页面上任意的元素进行样式控制…

阅读全文…

如何在CSS中实现父选择器效果?

2016年08月7日,星期日

虽然说至今尚无浏览器支持原生的父选择器效果,但是,我们是可以通过其他手段来实现父选择器效果的,虽说不是100%完全,但是,一般的项目需求都是可以满足的,如何实现呢?如果用一句话解释原理就是“把兄弟元素作为祖先元素使用”……

本文其他地方是看不到的哟~~

阅读全文…

简单聊聊CSS选择器中的正则表达式

2016年08月7日,星期日

没错,CSS也有正则,CSS装逼两利器:矩阵和正则。本文就简单介绍后面的正则,有示意有代码展示有截图有吐槽,希望本文的内容可以对您的学习有所帮助……

阅读全文…

DOM元素querySelectorAll可能让你意外的特性表现

2015年11月5日,星期四

我们内容正如标题所示,就是介绍大家可能的对DOM元素querySelectorAll方法一些认知不清楚的地方。没有Demo页面,但是有源代码,有截图。本文内容还行,浅显易懂,也容易消化和吸收,算是不错的tips知识get点。

阅读全文…

小tip:CSS计数器+伪类实现数值动态计算与呈现

2014年12月7日,星期日

内容如题,重在展示,以及开拓眼界,拓宽思路。与通常该调调的文章类似,有demo,有源代码展示,还有必要的截图。总之,希望本文的内容能够对您的学习有所帮助。

阅读全文…