《
CSS的未来：一些试验性CSS属性》文章地址：http://www.tfxk.com/wangyesheji/jianzhanjingyan/0302334342013.htm
想要禁用这个高亮，设置颜色的alpha值为0即可。
要让marquee工作需要一些条件前提,CSS的常用技巧介绍。首先，white-space必须设置为nowrap，这样才干让文字不主动换行，其次，overflow必需设置为-webkit-marquee，宽度也要设置为比文字实际长度小的数值。
1
另一个特征是，通过设定1px的透明边框，可以让文字变得平滑:
-webkit-mask: url(img/mask.png);
1
最常见的例子就是两个相邻的
.element{
为所有的
2
你还记得简直每个网站都把他们的网站logo或者头部的文字做成倒影的那个年代吗?谢天谢地，那个年代已经从前了，然而假如你要在一些按钮、导航、或者其余UI元素上更好的应用这个技巧，-webkit-box-reflect是更好的抉择。
--> [
网站建设之]CSS的将来：一些实验性CSS属性
只管现代浏览器已经支持了众多的CSS3属性，但是大部分设计师和开发职员貌似仍然在关注于一些很“主流”的属性，如border-radius、box-shadow或者transform等。它们有良好的文档、很好的测试并且最常用到，所以如果你最近在
设计网站，你很难能脱离它们。
示例
1
white-space: nowrap;
剩下的属性确保文字从左边转动到右边(-webkit-marquee-direction)、往返挪动(-webkit-marquee-style)以及以比较低的速度移动(-webkit-marquee-speed)。其它的属性有-webkit-marquee-repetition，用来定义marquee反复的次数，-webkit-marquee-increment, 定义每次递增的速度变化。
4
图片蒙板:
2
1
创建红色镂空字体：
width: 70px;
h3 {
元素会共享他们的margin值。想要节制这个表示，我们可以使用-webkit-margin-collapse及其分拆后的-webkit-margin-top-collapse、-webkit-margin-bottom-collapse等属性。默认值是collapse，值separate则结束共享margin值，也就是说，第一个元素的底部边距和第二个元素的头部边距会正常叠加。
但是，暗藏在阅读器的大宝库中是一些高等的、被重大低估的属性，但是它们并不得到太多的关注。或者它们中的一些应当这样(被疏忽)，但是其它的属性应该得到更多的认可。最巨大的财产隐蔽在Webkit的下面，而且在iPhone、iPad和Android apps的时期，开端懂得它们会灰常有用。就连Firefox等使用的Gecko引擎，也供给了一些奇特的属性。在本文中，咱们将看一下鲜为人知的CSS 2.1跟CSS3属性以及它们在古代浏览器中的支撑情形。
这个属性接收above、below、left和right四个要害词，它们设置倒影的方向，它们和一个设置元素和它的倒影建的间隔的数字一起使用。同时，蒙板图片也是同样支持的(看上面的-webkit-mask局部，不要搞混了哈)。倒影会自动天生并对布局没有影响。下面的元素只用了CSS，第二个按钮用了-webkit-box-reflect属性。
另一个属性让我们回到美妙的从前：那个遍地marquee(跑马灯)的年代。有趣的是这个已经被抛弃的标签反而在当初变的很有用，比方我们在比拟小的手机屏幕上切换内容，如果一直行的话文字将不能完整显示。
1
阐明: 对每个属性，我们这里划定：”WebKit” 即指代使用Webkit内核的浏览器(Safari、Chrome、iPhone、iPad、Android等)，”Gecko&ldquo,CSS的小技巧;指代采取Gecko内核的浏览器(Firefox等)。然后有的属性是官方CSS 2.1. 标准的一部门，这意味着更多的浏览器甚至一些古老的浏览器也会支持它们。最后，一个CSS3 的标签表明遵照这个尺度，被最新的浏览器版本——好比Firefox 4、Chrome 10、Safari 5、Opera 11.10以及IE9支持的属性。
示例
-webkit-mask
-webkit-box-reflect: right 0 url(mask.png);
示例
换行有时是很辣手的事件：有时你盼望文字在恰当的处所断行(而不是折行)，有时你又不想这样。一个能把持这个的属性就是-webkit-nbsp-mode，它让你可以转变 空缺符的行为，强迫文字在它被用到的地方断行。通过设置值为space即可实现。
background: url(img/image.jpg) repeat;
-webkit-box-reflect: below 5px;
设置高亮色为50%透明的红色:
浏览器支持: 只有iOS(iPhone和iPad).
示例
}
-webkit-box-reflect
3
CSS边框的一个不足就是只有矩形的元素能力使用。-webkit-text-stroke可认为文字增加边框。它岂但可以设置文字边框的宽度，也能设置其色彩。而且，配合使用color: transparent属性，你还可以创建镂空的字体!
1
-webkit-marquee-speed: slow;
2
3
这个属性只用于iOS (iPhone和iPad),css的好习惯。当你点击一个链接或者通过Javascript定义的可点击元素的时候，它就会涌现一个半透明的灰色背景。要重设这个表现，你可以设置-webkit-tap-highlight-color为任何颜色。
渐变蒙板:
注：固然HTML的marquee标签在XHTML中被摈弃了，但是各浏览器还是支持的，但是有一个问题就是，marquee标签可能会占用比较大的cpu，大猫对其进行了深入的研究，论断是marquee的速度不能太快，而webkit用-webkit-marquee属性是最好的——神飞。
background: url(img/image.jpg) repeat;
h2 {-webkit-text-stroke: 1px transparent}
}
-webkit-text-stroke
6
.marquee {
color: transparent;
-webkit-tap-highlight-color: rgba(255,0,0,0.5);
,CSS的”弹出式“图像浏览器.element2 {
这个属性属于限度级的，但是它仍是无比值得关注。通常，两个相邻的元素的margin会折叠起来(collapse)。这象征着第一个元素的底部的边距和第二个元素的头部边距会被合并到一起,CSS特殊性概念知识普及。
-webkit-mask: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
ozPDA创立的这个气象的利用很好的使用了它。 (如果你木有看到变换的文字,CSS特殊性概念 样式规则的次序，能够尝试换一个城市来休会。须要使用WebKit内核浏览器)
-webkit-tap-highlight-color
8
-webkit-marquee-direction: forwards,CSS滤镜效果之雷达屏幕;
-webkit-marquee-style: alternate;
示例
2
4
-webkit-text-stroke: 4px red;
通常来说，zoom是一个IE专用的属性。但是webkit也开始支持它了，而且使用值reset，webkit可以实现不错的后果(有趣的是,CSS滤镜效果之英雄救美，IE不支持这个值)。它让你重设掉浏览器中畸形的缩放行动——如果某个元素被申明了zoom:reset，页面上的其它元素在用户放大页面的时候都会随着放大。
h1 {-webkit-text-stroke: 2px blue}
注：实在,CSS滤镜效果之发光的文字，我们常用来禁用chrome强制字体大小的时候用到的-webkit-text-size-adjust:none;也是可以实现相似的效果，不同的是，设置该属性的元素内的文字不会被放大/缩小，但是页面上的其它元素则会变更——神飞
zoom: reset
Tag：属性 试验 一些 未来 属性 试验 一些 未来
这个倒影会呈现在它的父元素的下面并有5px的间距:
题目设定一个2px宽的蓝色边框:
1
1
-webkit-margin-collapse
WebKit特有属性
这个属性是相称强盛的，所以具体的先容超越了本文的范围，它十分值得深刻研讨，由于它可以在实际运用中为你省掉良多时光。
5
overflow:-webkit-marquee;
4
,CSS清除浮动的应用 位置影响IE和Chrom浏览器的错位;
}
这个倒影会投射到元素的右边，没有间距。而后，一个蒙板将会被应用(url(mask.png)):
4
-webkit-mask让为一个元素增添蒙板成为可能，从而你可以创建任意外形的名堂。蒙板可以是CSS3渐变或者半透明的PNG图片。蒙板元素的alpha值为0的时候会笼罩下面的元素，为1的时候会完全显示下面的内容。相干的属性有-webkit-mask-clip、 -webkit-mask-position 和-webkit-mask-repeat等，严峻依附来自于background中的语法。更多信息请查看webkit的博客和下面的链接。
3
}
-webkit-marquee
1
示例
-webkit-nbsp-mode
3
7
(责任编辑：网站建设)
CSS的未来：一些试验性CSS属性相关文章