checkbox

CSS3制作iPhone的Checkbox

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

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

美化表单——自定义checkbox和radio样式

如果你对本站比较观注的话,应该很清楚,前面就有这方面的介绍。因为大家都知道表单中的部分元素如果单单使用CSS是没办法完成的,所以最近花全力在学习这方面的制作。在本站有关于这样制作有好几个教程了,比如说:

美化表单——自定义单选按钮和复选按钮

大家都知道,在Web的Form中美化是最头痛的,尤其是表单中的“input[type=checkbox]”、“input[type="radio"]”、“input[type=file]”和select这些元素我们单单只使用CSS是无法匹配设计图的,像背景颜色或者背景图片,甚至说margin和padding等等在各浏览器下都没法实现一致的效果,具体大家可以看看这里所展示的页面效果。为了解决这样的问题,我们只有另选其他的途径。使用CSS和js配合,使用他们实现各浏览器的统一样式。

自定义表单——jQuery制作个性化Checkbox

要让表单中的元素具有个性化风格,仅仅通过样式来实现是相当困难的,大家都很清楚,每种内核的浏览器、每种系统平台下对form元素解析的风格都是不一致的。如果你想让form元素在各种平台或者说各种浏览器具有统一的样式风格,仅仅通过CSS来制作是很难达到统一的标准,但实现他也并不是一件很难的事情,你只要借助jQuery就能轻松的实现。那么今天开始一起来学习使用jQuery制作表单元素的系列,让你不在为此感到头痛。

返回顶部