现代 CSS

Airen的博客

CSS3 Media Queries模板

最早在《CSS3 Media Queries》一文中初探了CSS3的媒体类型和媒体特性的相关应用。简单的知道了使用这个能在各种不同的设备显示不一样的样式风格。随着Responsive的响应式设计的兴起,前面跟大家一起学习了:

Pure CSS3 Ribbons

前面在CSS3 Ribbons一文中介绍了一个纯CSS3制作的“Ribbons”效果,今天收集了更多的“Ribbons”效果,以供大家参考与学习,希望大家能喜欢。

在看具体每个demo之前,我们一起来看下面一个截图:

jQuery Timeline

TimelineVeriteCo写的一个jQuery插件。它将一连串的事件集合到一起,按时间轴的顺序展示这些发生的事件。你可以将各种媒体、图片、视频、地图等相关信息插入到timeline。结合设计可以完美的展示你的工作效率或者更强的信息。比如说你一年,或者多年下来人生中的大事等。

CSS3制作表单动态帮助信息

前几天在W3cplus Demo站上放了一个CSS3 Sliding Form Helps效果。

今天我们就一起来看看他是如何实现的。

CSS3制作菜单的Hover效果

最近一直在整理W3cplus Demo站点,收集和写了一些CSS3的Demo效果。今天整理了一下写的《How to spice up your menu with CSS3》效果,整理一下与大家一起学习。

CSS的陷阱

我们写CSS的在写CSS总会碰到一些这样那样的问题,为了应付这些问题,我们需要一些特殊的技巧才能解决。今天这篇文章我收集了几个怪异的问题,放上来给大家分享,希望大家以后碰到这样的问题能得心应手的解决。

Select最佳设置

昨天在携程UED中看到一篇关于表单元素中的Select的设置的文章,写的很有意思,详细的不多说,截了里面的一张图来说明Select的在各浏览器的测试情况:

最终得到select的最佳设置的值:

CSS3制作iPhone的Checkbox

iPhone上的UI的确是精致,让人爱不释手。今天用CSS3写了一个Checkbox的效果,采用了两种不同的方法来实现,另外在此基础上写了一个我们常用的checkbox的效果。

众所周知,想要美化表单中的元件,都少不了jQuery的帮忙,有关于这方面的介绍,本站也有过几篇相关的文章,比如说《美化表单——自定义单选按钮和复选按钮》、《自定义表单——JQuery制作个性化Checkbox》和《美化表单——自定义Checkbox和Radio样式》。那么有没有办法不使用jQuery呢?就是大家所说的纯CSS?如果你看了这篇文章后,你就会说,原来也可以实现呀。

CSS3和jQuery制作Login栏

这两天制作了一个登入栏效果的案例,简单点说就是集成了以前本站介绍的几个效果。

1、CSS3制作Login栏

2、CSS3和jQuery制作翻转表单

CSS3美化有序列表

好久没有逛Red Team的blog了,今天上去发现更新了几个好东东,自己动手做了一遍。觉得很有创意,有几个新知识点以前自己没有使用过,我想大家或许也没有使用过,整理了一下贴上来和大家分享。

css3制作3D分页导航

前面本站介绍了站上分页导航效果,今天在给大家推荐一个纯CSS制作的分布导航效果,这个效果中没有使用任何图片,并使用jQuery实现了“active”的效果。还有一个特别之处就是使用了WebSymbolsRegular制作了向前向后的箭头效果。

目标

今天我们的目标就是使用纯CSS来制作上图的一个分面导航的效果。

HTML Markup

这个效果用到的HTML结构就相当的简单了,就是一个容器“div#pager”里面放了一些“a”链接标签:

页面

返回顶部