理解CSS3 isolation: isolate的表现和作用

2016年01月9日 by 张 鑫旭 阅读 15188 次, 今日 4 次

如题,理解CSS3 isolation: isolate的表现和作用,isolation: isolate是一个与CSS3混合模式关系密切的一个CSS声明。

阅读全文…

深入理解CSS中的层叠上下文和层叠顺序

2016年01月9日 by 张 鑫旭 阅读 42471 次, 今日 2 次

本文是最近1-2个月最用心的文章,理解本文内容,就会明白网页中元素层叠的时候为什么会这样表现了,相信本文的内容一定会对您的学习有所帮助的。

阅读全文…

小tip: 如何让contenteditable元素只能输入纯文本

2016年01月7日 by 张 鑫旭 阅读 34238 次, 今日 3 次

利用全浏览器都支持的contenteditable模拟文本域可以实现体验相当不错的高度跟随内容自动撑开的效果,但是呢,有个很大的问题就是HTML内容可以直接被粘贴进去,如果我们希望只能输入纯文本,该怎么做呢?本文提供了CSS侧,HTML侧以及JS侧三种不同的解决方法,希望可以对您的学习或者工作有所帮助!

阅读全文…

小tip: 子元素scroll父元素容器不跟随滚动JS实现

2015年12月18日 by 张 鑫旭 阅读 30349 次

在网页中,滚动条的滚动行为也是类似的调调,如果页面出现多个内嵌滚动条,则行为表现是:子元素滚,子元素滚,子元素滚完父元素滚;父元素滚,父元素滚,父元素滚完容器滚……

这是浏览器的默认行为,如果我们遇到了一个需求:子元素滚,子元素滚完,就完了,父元素不需要滚了。那该如何实现呢?

阅读全文…

小tips: CSS或JS实现gif动态图片的停止与播放

2015年12月5日 by 张 鑫旭 阅读 36756 次, 今日 4 次

如题,本文介绍如何使用CSS或者JS等前端方法实现代码控制gif图片的暂停或者播放。一如既往,有demo有截图还有必要的源代码展示,更关键的是,本文gif比较多……

阅读全文…

HTML input type=file文件选择表单元素二三事

2015年11月24日 by 张 鑫旭 阅读 56611 次, 今日 3 次

本文一些简单tips整理,没有深入具体的技术细节。考虑到一些童鞋的HTML基础不是很扎实,因此,本文的一些内容说不定可以博闻强识下。有截图有源代码展示,没demo,嘻嘻……

阅读全文…

word-break:break-all和word-wrap:break-word的区别

2015年11月19日 by 张 鑫旭 阅读 20409 次, 今日 7 次

虽说标题是word-break:break-all和word-wrap:break-word的区别,实际上,两者的比对只是小半内容,还有很多内容是对word-break和word-wrap属性的一些了解。本文内容虽然不多,但是,demo啊截图啊什么的都还挺全,希望本文的内容能够对您的学习有所帮助。

阅读全文…

HTML5响应式图片技术中文图解

2015年11月6日 by 张 鑫旭 阅读 20507 次, 今日 2 次

本文主要图解了几种HTML侧的响应式图片的用法说明,希望可以对移动端同学的学习有所帮助。

阅读全文…

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

2015年11月5日 by 张 鑫旭 阅读 25283 次

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

阅读全文…

使用CSS3 will-change提高页面滚动、动画等渲染性能

2015年11月4日 by 张 鑫旭 阅读 27268 次, 今日 2 次

CSS3 will-change属于web标准属性,虽然目前还是草案阶段,但出现已经有些时日了,兼容性这块Chrome/FireFox/Opera都是支持的。

这个属性作用很单纯,就是“增强页面渲染性能”。那它是如何增强的呢?

本文都过一个实例抛出will-change这个概念,继而解释其作用,分析其语法,提示使用注意事项等。

希望本文的内容能够对大家的学习有所帮助。

阅读全文…