如何实现跨浏览器的SVG Sprites
CSS Sprites对于前端人员都比较熟悉,为了让Web网站减放Http的请求数,很多同学都常使用Sprites(国内称之为雪碧图或精灵)。但随着技术的更新,位图的Sprites已无法满足我们实际的需求了。这篇译文就用另外的一种方式,向大家阐述了Sprites——如何实现跨浏览器的SVG Sprites。
CSS Sprites对于前端人员都比较熟悉,为了让Web网站减放Http的请求数,很多同学都常使用Sprites(国内称之为雪碧图或精灵)。但随着技术的更新,位图的Sprites已无法满足我们实际的需求了。这篇译文就用另外的一种方式,向大家阐述了Sprites——如何实现跨浏览器的SVG Sprites。
首先,这篇文档不是给所有人看的。给谁呢?急需自己设计UI的开发者、想让自己的作品看上去比Pentagon PowerPoint、漂亮的UX设计师。或者想靠自己的UI挣钱的UX设计师。如果你曾就读过艺术学校,或者已自称为一名UI设计师,你可能会感到这篇文档a.)枯燥,b.)错误,c.)气人。没关系。你的批评都是正确的。关掉Tab页,离开即可。让我来告诉你你将从这篇文章中学到什么。
创造夺目UI的7条规则是一个系列文章,主要包括两个部分。总共包括七个设计规则:光来自天空、黑白优先、双倍空白、学习图片上放置文本的方法、使文本突出——或不突出、 只使用好看的字体和像艺术家一样偷师。这两篇文章在国外有关于UI设计引起很大的轰动性。特意将译文发出来与大家一起分享。最后非常感谢@李诺同学的分享。希望这两篇文章能给大家带来些许帮助。
本文是为“初学者”或者作为从一开始就想要学习更多跨DPI和跨平台设计知识的中级设计师准备的序言读物。没有复杂的计算和不可分析的图表,只是按照划分直截了当地将内容呈献给读者,便于读者理解或是直接运用到设计过程中。如果你发现有错误的地方,需要了解更多细节或者有任何问题或建议,请联系sgabriel.contact@gmail.com Twitter, G+ 或者 Facebook
Flexbox是CSS3新增的一个功能特性,对于布局有很大方便之处。但浏览器支持力度各异,而且其规范也还在不断更新之中,也造成很多同学还不敢在实际项目中使用Flexbox的缘故。Philip Walton在他的Github中创建了Flexbugs库,用来回收Flexbox相关的Bug。主要宗旨是收集Flexbox跨浏览器存在的问题和解决方案。目标是让你使用Flexobx构建一个网站能得到你想要的效果,并且能在这里找到相应的解决方案。而这篇文章就是以创建Sticky footer布局为例,介绍了如何解决Flexbox在浏览器兼容的解决方案。
很少有人针对CSS的使用做一份详细的报告,今天看到Alex McPherson的《The 2014 CSS Report:Examining how CSS is being used in the wild》一篇文章,作者通过近万个网站的CSS样式文件做分析,得出这份2014年CSS使用报告。觉得很有意义,特意将其整理到站上,让大家也了解这份报告说了哪些东西。希望对大家有所帮助。
对于Web前端开发人员来说,或许有碰到过打印页样样式的设计。说起这个或许很多同学都会想起打印样式表。但真正打印样式表要如何设计,如何制作?并没有太式人深纠。也致使很多同学在让客户打印机能更好打印Web页面时非常的痛苦。在这篇文章里,我们将探索一些已有的CSS模块,它们不是在网页浏览器中使用,而是为了解决打印和分页的问题。我将解释选择器,属性和值的作用。最后我会提供一个实际例子,你可以把它作为自己试验的基础。对于这个例子,我们需要支持这些特殊CSS。我正在用的是Prince,它是一个商业软件。然而,Prince有针对非商业使用的免费版本,是实验这些例子的好工具。
Sass Guidelines是法国一位前端工程师Hugo Giraudel编写的一份有关于Sass相关的规范指南。有一份规范的指南能协助您更理智的,更好维护和更好扩展Sass。而且这份指南已经翻译成多个语言版本,受到Sass爱好都的一致好评。那么在我们大中华区域,我和@南北同学一起将其译成中文,希望能对大家有所帮助。如果译得不对之处,还请多多指正
上篇Sass Guidelines中文版本之一:相关信息主要介绍了Sass Guidelines相关的信息,那么在这一节中将进入正轨,向大家开始介绍Sass Guidelines有关于Sass的相关内容。主要介绍了为什么要一份这样的指南,其原则是什么,以及Sass的一些语法书写规范围等等。
通过Sass Guidelines中文版本之一:相关信息和Sass Guidelines中文版本之二:简介的阅读,我想大家对Sass Guidelines或多或少有一点了解,如果你对此规范指南感兴趣的话,那么接下来可以阅读这篇文章,这是Sass Guidelines第三部分,主要介绍了如何在Sass编写中命名和写注释。里面提供的一些细节还是值得大家编码中注意一二的。