快速业务通道

CSS的未来:鲜为人知的CSS 2.1和CSS3属性

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-02-23

扩展阅读: Safari Developer Library

-webkit-text-stroke

CSS边框的一个不足就是只有矩形的元素才能使用。-webkit-text-stroke可以为文字添加边框。它不但可以设置文字边框的宽度,也能设置其颜色。而且,配合使用color: transparent属性,你还可以创建镂空的字体!

示例

为所有的<h1>标题设定一个2px宽的蓝色边框:

1
h1 {-webkit-text-stroke: 2px blue}

另一个特性是,通过设定1px的透明边框,可以让文字变得平滑:

1
h2 {-webkit-text-stroke: 1px transparent}

创建红色镂空字体:

1
2
3
4
h3 {
color: transparent;
-webkit-text-stroke: 4px red;
}

CSS的未来:一些试验性CSS属性

扩展阅读: Safari Developer Library

-webkit-nbsp-mode

换行有时是很棘手的事情:有时你希望文字在适当的地方断行(而不是折行),有时你又不想这样。一个能控制这个的属性就是-webkit-nbsp-mode,它让你可以改变&nbsp;空白符的行为,强制文字在它被用到的地方断行。通过设置值为space即可实现。

扩展阅读: Safari Developer Library

-webkit-tap-highlight-color

这个属性只用于iOS (iPhone和iPad)。当你点击一个链接或者通过Javascript定义的可点击元素的时候,它就会出现一个半透明的灰色背景。要重设这个表现,你可以设置-webkit-tap-highlight-color为任何颜色。

想要禁用这个高亮,设置颜色的alpha值为0即可。

示例

设置高亮色为50%透明的红色:

1
-webkit-tap-highlight-color: rgba(255,0,0,0.5);

浏览器支持: 只有iOS(iPhone和iPad).

扩展阅读: Safari Developer Library

zoom: reset

通常来说,zoom是一个IE专用的属性。但是webkit也开始支持它了,而且使用值reset,webkit可以实现不错的效果(有趣的是,IE不支持这个值)。它让你重设掉浏览器中正常的缩放行为——如果某个元素被声明了zoom:reset,页面上的其它元素在用户放大页面的时候都会跟着放大。

注:其实,我们常用来禁用chrome强制字体大

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号