如何提问才能进阶成为前端大神?

2015年05月8日 by 张 鑫旭 阅读 169082 次, 今日 2 次

基本上每天微博、博客以及邮件都会受到很多同行的问题咨询,我个人是非常欢迎交流与学习的,因此有问必答。但是,毕竟一个人精力有限,我又没有财力请经纪人或者小秘之类的,如何高效利用时间就是对于我来讲就是非常重要的事情。毕竟,我的本职工作不是技术咨询师,而是在厂子里干活。其中一点就是固定时间处理邮件,蛋的!就是这个邮件沟通,有好几次,几位同行的提问让我很火大,早就想写篇文章,教教这些人怎么才是高效地邮件沟通之道……

阅读全文…

小tip: CSS3如何实现圆角的outline效果?

2015年04月30日 by 张 鑫旭 阅读 89482 次, 今日 6 次

茫茫CSS海,乍一看去,貌似没有能让outline圆角的东西。注意措辞,“貌似”,我们如果有双犀利的眼睛,还是会发现某处藏可以让outline圆角的东西。这个东西是?……

点进去看看就知道了,有Demo,有截图,有源代码展示盒必要的讲解,总之,希望本文的内容能够对您的学习有所帮助!

阅读全文…

CSS之before, after伪元素特性表现两则

2015年04月19日 by 张 鑫旭 阅读 70604 次, 今日 3 次

伪元素之所以称之为“伪元素”一定是有其原因的,本文就举两个特征例子,展示下伪元素跟普通元素,到底有哪些不一样的地方。

依然,有Demo、有截图,有源代码展示。总之,希望本文的内容能够对您的学习有所帮助。

阅读全文…

了解web前端领域的undefined behavior未定义行为

2015年04月18日 by 张 鑫旭 阅读 29565 次, 今日 5 次

undefined behavior可以算是计算机世界中特有的一个名字,中文意思是“未定义行为”,维基百科上有解释。在C以及C++语言中,这可以算是一个比较明确的概念。

实际上,在web前端领域,也有undefined behavior未定义行为,且广泛程度远远超出了你的想象。
undefined behavior从web标准出现之后,实际上就广泛存在web网页前端技术中,我们很多时候遇到的浏览器兼容性问题,可能就属于……

阅读全文…

CSS3 clip-path polygon图形构建与动画变换二三事

2015年03月26日 by 张 鑫旭 阅读 86854 次, 今日 5 次

本文絮絮叨叨CSS3 clip-path polygon在图形构建和动画这块的三两事,没什么惊天动地的知识点,大家可以当散文看下。放心,有demo有截图有代码展示,还有视频播放呢!总之,希望本文的内容能够对您的学习有所帮助。

阅读全文…

小tip: 纯CSS实现视差滚动效果

2015年03月17日 by 张 鑫旭 阅读 124964 次, 今日 7 次

视差滚动效果大家可能都听过,基本上都是JS实现的。

实际上,如果你对兼容性要求不是很高,比方说忽略IE浏览器,则我们使用简单的几行CSS代码就可以实现视差滚动效果了。而本文就是介绍如何使用CSS实现视差滚动效果的。有Demo有截图有源代码展示,总之,希望本文的内容能够对您的学习有所帮助。

阅读全文…

CSS <position>值简介理解background百分比定位

2015年03月16日 by 张 鑫旭 阅读 63625 次

MDN上<position>值解释是:一种CSS数据类型,2D坐标空间,用来设置相对盒子的坐标。

我们经常使用的background-position的值就是<position>值,最近刚介绍的object-position的值也是<position>值。

<position>值支持1~4个值,可以是具体数值,也可以是百分比,也可以是……

阅读全文…

小tips: CSS3 webkit下彩条文字效果实现

2015年03月15日 by 张 鑫旭 阅读 33319 次

此效果用的是以前介绍过的两个技术实现,第一个就是CSS3实现纹理图案背景,第二个就是文字遮罩实现。两者合在一起就可以实现彩条文字效果了。

阅读全文…

半深入理解CSS3 object-position/object-fit属性

2015年03月15日 by 张 鑫旭 阅读 164362 次, 今日 3 次


现代web显示环境万变,响应式布局(适配移动端)、半响应布局(宽窄屏适配)以及传统流体布局(任意宽度水平自适应)都比较常见,结果,在处理这些有着固定尺寸的元素的时候,就会遇到障碍,例如,一个2:1的视频,永远要等比例充满容器,但是,随着浏览器宽度不一样,容器的长宽比有可能小于2,也有可能大于2. 你说,你能轻松实现小于比例2时候,视频宽度100%;比例大于2的时候,高度100%吗?

显然,很麻烦,最后大多还是使用JS去把控。正是为了应对类似这样的响应式需求,object-fit和object-position才应运而生……

阅读全文…

小tip: 使用meta实现页面的定时刷新或跳转

2015年03月11日 by 张 鑫旭 阅读 63849 次, 今日 2 次

几乎所有的网页头部都有源信息。除了我们常用的定义编码、关键字(name=”keywords”)、描述(name=”description”),还可以定义视区大小,缩放比例等(for 移动端),以及,定义网页的过期时间,Cookie的过期时间等等。
文本要介绍的内容,科科,跟上面都没关系……

阅读全文…