SVG精简压缩工具svgo简介和初体验

2016年02月29日 by 张 鑫旭 阅读 110848 次, 今日 259 次

SVG文件,尤其从各种变假期导出的SVG,通常包含大量的无用信息,例如编辑器源信息,注释,因此元素,默认或者非最优值,以及其他一些不会影响渲染结果的可以移除或转换的内容。

有没有什么工具可以简化这些信息呢,有,不妨试试本文介绍的svgo.

阅读全文…

CSS镂空图片transition过渡初加载背景色块问题解决

2016年02月25日 by 张 鑫旭 阅读 51204 次, 今日 3 次

CSS镂空图片,由于颜色是CSS属性值控制,如color或者background-color, 因此可以实现transition过渡效果,同时节约资源。然而有个很严重的问题,就是加载时候,容易出现色块,而本文就将展示如何解决色块的问题,让好的技术更加适用!

有demo有截图有必要的源代码展示,希望本文的内容可以对您的学习有所帮助!

阅读全文…

HTML textarea cols,rows属性和宽度高度关系研究

2016年02月4日 by 张 鑫旭 阅读 77672 次, 今日 17 次

<textarea>元素,俗称“文本域”,或者“多行文本框”,其自带原生的HTML属性rows表示行的意思,可以改变<textarea>的可视区域高度,cols表示列,可以改变<textarea>的可视区域宽度。

下面问题来了,我想很多小伙伴知道colsrows可以影响文本域的尺寸,那colsrows不同的数值和最终展示的像素尺寸之间有没有什么关系呢?可不可以通过公式计算呢?最终表现是否还受到其他CSS属性的影响呢?

本文就将解答上面的这些疑惑,一起进去看看吧~

阅读全文…

CSS font关键字属性值的简单研究

2016年01月27日 by 张 鑫旭 阅读 36846 次, 今日 4 次

ont属性值除了支持常用的缩写,还支持系统关键字,这种用法在某些场景下非常的有用。本文就带你前去一探究竟。有demo有源代码有截图,希望本文的内容能够对您的学习有所帮助!

阅读全文…

基于原生HTML的UI组件开发

2016年01月22日 by 张 鑫旭 阅读 80873 次, 今日 4 次

本文属于波澜不惊,平铺直叙版本。如果想看有有激情有思想的版本,可以去ISUX官博:“顺势而为,HTML发展与UI组件设计进化”

阅读全文…

前端早读课专访

2016年01月13日 by 张 鑫旭 阅读 82510 次, 今日 4 次

前端早读课访谈,分享自己的一些心理历程,以及对前端的一些看法等等。

阅读全文…

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

2016年01月9日 by 张 鑫旭 阅读 64816 次, 今日 12 次

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

阅读全文…

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

2016年01月9日 by 张 鑫旭 阅读 239637 次, 今日 27 次

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

阅读全文…

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

2016年01月7日 by 张 鑫旭 阅读 243722 次, 今日 31 次

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

阅读全文…

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

2015年12月18日 by 张 鑫旭 阅读 102622 次, 今日 12 次

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

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

阅读全文…