nullnullCSS的未来-- 那些被我们忽略的属性Harmless Propertiesborder-radius
box-shadow
transform
……Harmless Properties-webkit-mask-webkit-mask-webkit-maskImage mask
-webkit-mask: url(images/mask.png);
Gradient mask
-webkit-mask: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));-webkit-mask-webkit-maskDemo:与 transform 结合
img { -webkit-transition-property: left,opacity; -webkit-transition-duration: 1s; opacity: 1; }
.demo1:active { opacity: 0; -webkit-mask-box-image:url(images/mask2.png) 100 stretch; }
.demo2:hover { -webkit-mask: -webkit-gradient(linear,right top,left top,from(rgba(0,0,0,1)),to(rgba(0,0,0,0))); }-webkit-masknulltext-align: -webkit-center margin: 0 auto;
text-align: -webkit-center/-moz-centertext-align: -webkit-centercounter-increment ol { counter-reset: thecounter; }
li:before {
counter-increment: thecounter 1;
content: “item”counters(thecounter, “.")“:";
}
-
counter-incrementitem1:
item2:
item2.1:
item2.2:quotes q { quotes: “«” “»” “<” “>”; }
q:before { content: open-quote; }
q:after { content: close-quote; }quotesquotes
How to code html
in prototype?
«How to code in prototype?»quotesfor iOS-webkit-tap-hightlight-color
-webkit-tab-hightlight-color: rgba(255,0,0,0.5);
-webkit-user-select
-webkit-user-select: none;for iOSSpeak Less, Think MoreSpeak Less, Think More增强网站的细节体验
Enhance your websites with these properties
扩展阅读:
Safari Developer Library
http://developer.apple.com/library/safari/navigation/#section=Libraries&topic=WebKitThank you@点头猪 (@ctripUED)
MSN: xll2651@hotmail.com
Gtalk: xll2651@gmail.com
Email: llxue@ctrip.comThank you