::marker是CSS中新出的一种伪元素,用来匹配列表项中的marker box,可以改变项目符号的颜色字体等,甚至改变项目符号内容,填补了CSS以前这块的能力空白。
文章关键字 ‘::after’
常见的CSS图形绘制合集
2019年01月14日,星期一展示40多个常见的纯CSS绘制图形,效果实时,含源代码,想要什么效果直接复制粘贴就好了。就算项目用不到,看看别人代码怎么写的也有助于提高CSS的基本功。
before(),after(),prepend(),append()等新DOM方法简介
2017年09月28日,星期四接下来要介绍这些新增的DOM API方法,都比较新,其设计目的是可以像jQuery那样,使用非常简单的api,便利的操作dom元素。
这些api包括:before()
,after()
,replaceWith()
,append()
,prepend()
……
CSS content换行实现字符点点点loading效果
2016年11月13日,星期日CSS content字符生成配合CSS3 animation可以各类字符loading效果实现,一起过来看看眼界,学习学习新的实现思路吧~~
CSS之before, after伪元素特性表现两则
2015年04月19日,星期日伪元素之所以称之为“伪元素”一定是有其原因的,本文就举两个特征例子,展示下伪元素跟普通元素,到底有哪些不一样的地方。
依然,有Demo、有截图,有源代码展示。总之,希望本文的内容能够对您的学习有所帮助。
CSS counter计数器(content目录序号自动递增)详解
2014年08月26日,星期二CSS计数器不是什么新鲜玩意了,早在10年春暖花开的时候,我写的“CSS content内容生成技术以及应用”一文就要提到,不过当时是作为其中一员介绍。就像例行的溜新同事一样,虽然黑如焦炭的我在自我介绍的时候给新同事留下了深刻印象,但由于介绍的同事茫茫多,我只是其中一员。很自然,个把月之后,我就会被无情的淡忘,除了那依稀的面庞,因为毕竟长得还算比较抽象。
然而,CSS计数器的斗量显然不是短短几句介绍能够显露的,所谓人不可貌相。今天,就大肆笔墨,好好地全面地介绍了下CSS计数器,确实有很多知识点,确实有很多不太好理解的地方,确实有很多会踩坑的地方,果然深不可测。不过,本文有着详实的文字,丰富的截图,完全的demo,必要的源代码展示。相信本文的内容会对你的学习有所帮助的!
我是如何在实际项目中使用before/after伪元素的
2012年11月16日,星期五before/after伪元素相当于在元素内部插入两个额外的标签,其最适合也是最推荐的应用就是图形生成。在一些精致的UI实现上,可以简化HTML代码,提高可读性和可维护性。国外这两个伪元素应用相当的普及以及兴盛,不过貌似我们这边前端er们普遍缺乏使用这两个伪元素的意识,要使用顶多也就是跟风的“清除浮动”应用。
我想,这可能受兼容性思维影响……
伪类+js实现CSS3 media queries跨界准确判断
2012年05月11日,星期五我们都知道,CSS3 media queries是响应布局实现之利器。国外很多著名的前端站点,如css-tricks, smashingmagazinegazine等都采用了响应布局。
虽然国内此技术应用就像是打不着的打火机,没法跟如火如荼的欧美相比。但是,毕竟趋势是向前发展的,总会迎来遍地开花的时候,只是时间的长短而已。
media queries可以让设备在不同尺寸下应用不同的CSS样式、布局等。以适应手持设备、普屏显示器、宽屏显示器,以及未来冰箱上的联网显示器,汽车上的数码设备等。然后,仅仅通过CSS做布局可能无法应对所有的交互请求。
……
如何让JS的修改与CSS布局改变同步呢?
小tip: 使用CSS(Unicode字符)让inline水平元素换行
2012年03月2日,星期五本文旨在介绍一种自认为比较新颖有趣的技术。可以仅仅通过CSS控制inline元素元素换行的问题。其中,借助了特殊的Unicode字符编码字符。一如既往,有实例,有截图,有源代码展示。希望本文的内容能够对您的学习有所帮助。