现代 CSS

【Sass初级】定义好的变量名

Sass中的定义变量是非常的强大的,你可以在一个地方定义好变量,在项目的多个地方使用这个定义的变量。它允许你在集中的一个地方做变化,而不需要在项目和多个文件中使用查找替换的方式来做修改。但是选择一个好的变量名是一件比较困能的事情。如果你不小心,在项目中变量很容易失控。最常见的就是你会忘记了在项目中定义了什么变量名,因为你很难记住你定义的所有变量名,这样有可能会给你在项目开发中带来不必要的挫折。

探索Sass3.3中的Maps(二):Sass Maps和Memoization

在介绍Sass Maps的博客系列中,第一篇文章主要介绍了Sass3.3 引入了Sass Maps,而在第二部分(这篇文章),我将向大家阐述Sass Maps更强大用途之一:memoization。Memoization技术已经常期用于其他语言当中,以来提高性能。它涉及到一个函数结果的缓存,是这样的,如果一个函数使用相同的的参数调用两次,那么缓存的副本可以用来替代需要再次计算的值。

Ratchet教程:Buttons组件

按钮(Buttons)在Web页中的地位不用多说,大家都知道他是非常的重要。那么继Ratchet框架中“Badges组件”之后,要给跟大家一起聊的是Ratchet框架中的Buttons组件。

Ratchet教程:Badge组件

通过Ratchet教程案例实战一练习之后,我想大家对Ratchet框架有了进一步的了解,或者已经能使用Ratchet框制作一些移动端的页面(也称为H5网站)。其实Ratchet框架中不仅仅包括这些东东,他还具备其他的组件。那么今天我们继续来了解Ratchet框架中的Badges(标签)

使用CSS3制作倒影

在Web制作中,有些时候需要实现一些倒影的效果。比如说,你看到一个美女,你想从另一个角度来看这个MM的风姿。在早前要实现这样的效果我们都必须借助于类似于Photoshop这样的制作图软件来实现,然后通过引入一张image。那么除了图片,我们有没有别的方法能实现呢?值得庆幸的是,到目前为之,CSS3有一个属性可以实现。那么今天我们要给大家介绍的就是这个属性的应用。

使用字符串(STRINGS)设置样式

今年在墨尔本(澳大利亚)举办的CSSConf中,我有一个主题需要演讲——"Styling With STRINGS"。该讲座主要介绍的是在组件中如何使用FlexboxcurrentColorem,在浏览器中快速实现Web应用程序所需要的风格。其实这篇文章更是向大家介绍了如何通过修改一个属性就能修改整个组件的大小、颜色。并且简单介绍了如何让你把修改好的文件能直接放置在你的本地目录中。虽然描述短小,但涉及的知识点还是蛮有意思的,希望这篇译文能对你今后的工作略有帮助。

Srcset和sizes

四年前,ETHAN MARCOTTE发布了一篇文章(《Responsive Web Design》)之后的第13天,Steve Jobs发布了iPhone,突然有了流体视网膜(Retina)图像一说;也突然有了相关争论。我们面对实现流体图片又名视网膜又名响应式图片的第一反应就是使用制作响应式布局的工具:媒体查询!浏览器无法知道它加载的网页是什么,但他可以意识到他们的渲染环境,比如说视窗大小,用户屏幕的分辨率等诸如此类的事情。

Ratchet教程:案例实战一

到目前为止,有关于Ratchet系列教程在站上总共发布了八篇,从Ratchet的安装自动化的部署与组件概览,从项目的创建Meta与link标签的应用,当然除了这些,还介绍了Ratchet组件是的Bar组件列表组件。可以说,通过这几篇教程,大家对Ratchet有一个基本的了解,并且可以借助于Ratchet框架实现一些简单的移动页面。

Ratchet教程:自定义列表(二)

在上一篇教程——《Ratchet教程:自定义列表》中介绍了如何依赖于Ratchet框架构建属于自己的列表。比如常见的“纯文本列表”、“带图片的列表”、“带提示信息的列表”以及“带箭头的列表”等。但我们很多时候列表不只这些风格,比如说带有Icon图标的列表就是常见的一种,比如说带有按钮和切换开头的列表等。

Ratchet教程:自定义列表

我把Ratchet框架组件中的“Table Views”称为列表。实在找不出更易理解与形象的词语,当然你也可以直接将其称为“Table Views”。我们就不纠结这个了。那么从这一节开始,我想和大家一起探讨Ratchet框架中的列表制作。当然是构建适合自己的列表。

页面

返回顶部