一起CSS

搜索

当前位置：一起CSS

HTML 5 表单

分类：前端技术

表单是页面中不可缺少的元素，没有表单，就没有现在如此生动，趣味的页面。不过虽然表单很重要，但在 HTML 5 之前，表单的元素不多，属性和方法也不多，很多属性和方法都是用 JavaScript 模拟的，用 JavaScript 模拟这些功能要花费不少的时间和精力。如果用户能使用到这些模拟的功能，那么花费是值得的；如果用户客户端禁用 JavaScript，那么这些功能将全部挂掉，时间和精力都白白浪费了。 HTML 5 出现之后，这一切都不同了。HTML 5 增加的表单、表单类型以及表单属性，不但节省了开发者的时间，而且让更多应用成文可能。下面来看看 HMTL 5 新增表单类型的简单说明。

新增的 input 元素类型

类型 类型名称 功能描述
color 颜色选择器 输入颜色值的文本框
date 日期选择器 输入日期的文本框
datetime 日期时间选择器 输入 UTC 日期和时间的文本框
datetime-local 日期时间选择器（本地） 输入本地日期和时间的文本框
month 月份选择器 输入月份的文本框
time 时间文本框 输入时间的文本框
week 周选择框 输入周的文本框
email 邮件输入框 输入 E-mail 地址的文本框
number 数字输入框 输入数字的文本框，可以设置输入值的范围
range 数字滑动条 通过拖动滑动条改变一定范围内的数字
search 搜索输入框 输入搜索关键字操作的文本框
tel 电话号码输入框 输入电话号码
url Web 地址输入框 输入 URL 地址的文本框

阅读全文 >>

查看：465 评论：1 标签：

用 selection 让“选择”五彩缤纷

分类：CSS

从接触网络到现在，选择的文本后的样式似乎一直都是蓝底白字，如下图（截自 Firefox 5 浏览器）：

选择文本的默认样式截图

这一成不变的颜色，有没有让你的视觉感到疲劳。你有没有想过换成自己喜欢或者其他颜色呢？也许你会问这个可能吗？之前不可能，但现在，CSS 3 让这个成为可能。

要改变选中文本的颜色和背景颜色，需要使用 CSS3 新增的伪 ::selection，设置颜色 color 和背景颜色 background-colcr 即可，如：

::selection { color:#333; background-color:#cce8cf;}
::-moz-selection { color:#333; background-color:#cce8cf;}
::-webkit-selection { color:#333; background-color:#cce8cf;}

阅读全文 >>

查看：4,461 评论：9 标签：

你从哪里来？——include上方的空格

分类：前端技术

include 一个文件之后，这块代码的上面出现了很多空格，有木有！！！

前段时间我就遇到这样的问题，用 Firebug 查看，看到代码有一个地方“断”开了，点击那块区域竟然能编辑，里面全是空格。把这些空格删掉之后页面就正常了。好吧，既然是页面上多了空格，那就删掉。然后在源文件里没有看到空格，甚至连标签的缩进都删除了，那些空格依然存在。

经过排查，发现是 include 的文件问题，但是为什么这个文件会有问题呢？百度 GG 后，才知道这个问题由 utf-8 文件 Unicode 签名 (BOM) 产生的。

什么是 Unicode 签名 (BOM)？

BOM(Byte Order Mark)，是 utf 编码方案里用于标识编码的标准标记，在 utf-16 里本来是 FF FE，变成 utf-8 就成了 EF BB BF。这个标记是可选的，因为 utf-8 字节没有顺序，所以它可以被用来检测一个字节流是否是 utf-8 编码的。微软做这种检测，但有些软件不做这种检测，而把它当作正常字符处理。

微软在自己的 utf-8 格式的文本文件之前加上了 EF BB BF 三个字节, Windows 上面的 Notepad 等程序就是根据这三个字节来确定一个文本文件是 ASCII 的还是 utf-8 的, 然而这个只是微软暗自作的标记, 其它平台上并没有对 utf-8 文本文件做个这样的标记。也就是说一个 utf-8 文件可能有 BOM，也可能没有 BOM。

阅读全文 >>

查看：3,141 评论：2 标签：

3月份IE浏览器份额继续下滑 IE9不敌FF4

分类：浏览器

据国外媒体报道，互联网流量监测机构 Net Applications 最新发布的统计数据显示，尽管上市时间晚于微软的 IE9，但是 Mozilla 基金会的 Firefox4 市场份额仍然超过了 IE9。

微软在今年 3 月 14 日发布了 IE9 ，而 Mozilla 基金会在 3 月 22 日推出了 Firefox4 。尽管 Firefox4 发布时间更晚，但截至 3 月末，IE9 占据了全球浏览器市场 1.0% 的份额，而 Firefox4的市场份额却达到了 1.7%。

2009年10月至2011年3月浏览器市场占有率图片

阅读全文 >>

查看：3,930 评论：2 标签：,,

愚你一下 美团网翻转

分类：CSS

今天是愚人节，不知道大家有没有被愚弄。各大网站为了在今天显得特别，也纷纷搞怪。比如团购网站美团，来了个水平 180 度的翻转，虽然看上去怪怪的，但也算为“一成不变”的日子增加了一点乐趣，谁叫今天是愚人节呢。

美团网2011年愚人节截图

搞怪之余，我们也可以看看他是如何实现的。查看源代码能明显的看到是通过 CSS3 的变形、变换属性 transform 实现的，可惜的是，这个属性还没有任何浏览器支持（包括 Firefox4、Chrome12、Opera11、IE9）,但他们却都有各自的私有属性能实现这个效果，所以几乎是在所有浏览器中打开今天的美团网，都能看到同样的效果。

阅读全文 >>

查看：3,832 评论：2 标签：

页面 1/2412345678910...尾页