当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > safari:webkit

HTML/XHTML教程
一些不太常用的XHTML标签用法以及实例
网页中图片的设置涉及的三个问题
商业HTML邮件的制作建议
HTML Marquee 字符片段滚动
DOCTYPE 文档类型声明(网页爱好者必看)
纯HTML标签你熟悉多少?
HTML元素的ID和Name属性的区别
HTML meta的大作用
HTML标签tbody的用法与说明
HTML 特殊字符转换表
HTML基础 HTML的组成结构
HTML基础之HTML内容细则
Shtml 精简教程
浅谈html table 标签
html Frame、Iframe、Frameset 的区别
HTML 网页页面切换的各种变换效果
HTML的10个表格相关标记
让IE8启动IE7兼容模式的代码
HTML 结构化实现方法
xhtml的块级标记小结

HTML/XHTML教程 中的 safari:webkit


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 736 ::
收藏到网摘: n/a

支持CSS属性

Safari和WebKit实施大子的CSS 2.1规格所界定的万维网联盟( W3C ) ,以及部分的CSS 3规格。 。

这个CSS属性本条划分的群体界定由W3C的CSS规格

  • “盒模型”的具体描述性质的包围盒块内容,包括边界,填充,和利润率。附加框相关属性的特定表中分别介绍了“表。 ”
  • “视觉格式化模型”描述性质,确定了位置和大小的块元素。
  • “视觉效果”描述属性,调整的视觉效果块内容,包括溢出行为,调整行为,能见度,动画,变换,和过渡。
  • “生成的内容,自动编号,并列出”描述属性,允许您更改内容的一个组成部分,创建自动编号的章节和标题,和操纵的风格清单的内容。
  • “分页媒体”描述性能与外观的属性,控制印刷版本的网页,如分页符的行为。
  • “颜色和背景”描述属性控制背景下的块级元素和颜色的文本内容的组成部分。
  • “字型”的具体描述性质的文字字体的选择范围内的一个因素。报告还描述属性用于下载字体定义。
  • “文本”描述属性的特定文字样式,间距和自动滚屏(帐篷) 。
  • “表格”描述的布局和设计性能表的具体内容。
  • “用户界面”描述属性,涉及到用户界面元素在浏览器中,如滚动文字区,滚动条,等等。 报告还描述属性,范围以外的网页内容,如光标的标注样式和显示当您按住触摸触摸目标,如在iPhone上的链接。

1,webkit Box模型

 CSS定义:-webkit-border-bottom-left-radius: radius;
 CSS定义:-webkit-border-top-left-radius: horizontal_radius vertical_radius;
 CSS定义:-webkit-border-radius:radius;
 CSS定义:-webkit-box-sizing: sizing_model; 边框常量值:border-box
 CSS定义:-webkit-box-sizing: sizing_model; 内容常量值:content-box
 CSS定义:-webkit-box-shadow: hoff voff blur color;
 CSS定义:-webkit-margin-bottom-collapse: collapse_behavior;常量值:collapse
 CSS定义:-webkit-margin-bottom-collapse: collapse_behavior;常量值:discard
 CSS定义:-webkit-margin-bottom-collapse: collapse_behavior;常量值:separate
 CSS定义:-webkit-margin-start: width;
 CSS定义:-webkit-padding-start: width;
 CSS定义:-webkit-border-image:url(borderimg.gif) 25 25 25 25 round round;
 CSS定义:-webkit-border-image:url(borderimg.gif) 25 25 25 25 stretch stretch;

2,可视化格式模型

 CSS定义:direction:rtl
 CSS定义:unicode-bidi:bidi-override常量:bidi-override,embed,normal

3,视觉效果

 CSS定义:clip: rect(10px, 5px, 10px, 5px)
 CSS定义:resize:auto;常量:auto, both, horizontal, none, vertical
 CSS定义:visibility:visible;常量: collapse, hidden, visible
 CSS定义:-webkit-transition: opacity 1s linear; 动画效果 ease,linear,ease-in,ease-out,ease-in-out
 CSS定义:-webkit-backface-visibility: visibler; 常量:visible(默认值),hidden
 CSS定义:-webkit-box-reflect: right 1px; 镜向反转
 CSS定义:-webkit-box-reflect:below 4px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.5, transparent), to(white));
 CSS定义:-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));;CSS遮罩/蒙板效果   
 CSS定义:-webkit-mask-attachment:fixed;  常量:fixed,scroll
 CSS定义:-webkit-perspective: value; 常量:none(默认)
 CSS定义:-webkit-perspective-origin:left top;
 CSS定义:-webkit-transform:rotate(5deg);  
 CSS定义:-webkit-transform-style:preserve-3d; 常量:flat,preserve-3d;(2D与3D)

4,生成目录

CSS定义:content: “Item” counter(section) ” “;
This resets the counter.
First section
>two section
three section
 CSS定义:counter-increment: section 1;
 CSS定义:counter-reset:section;

5,分页媒体

CSS定义:page-break-after:auto; 常量:always, auto, avoid, left, right
CSS定义:page-break-before:auto; 常量:always, auto, avoid, left, right
CSS定义:page-break-inside:auto; 常量:auto, avoid

6,颜色与背景

CSS定义:-webkit-background-clip:content; 常量:border,content,padding,text
CSS定义:-webkit-background-origin:padding; 常量:border,content,padding,text
CSS定义:-webkit-background-size:55px; 常量:length,length_x,length_y

7,字体

CSS定义:unicode-range: U+00-FF, U+980-9FF;

8,文字

CSS定义:text-shadow:#00FFFC 10px 10px 5px;
CSS定义:text-transform:capitalize;    常量:capitalize, lowercase, none, uppercase
CSS定义:word-wrap:break-word;    常量:break-word, normal
CSS定义:-webkit-marquee:right large infinite normal 10s;   常量:direction(方向) increment(迭代次数) repetition(重复) style(样式) speed(速度);
-webkit-marquee-direction:ahead,auto,backwards,down,forwards,left,reverse,right,up
-webkit-marquee-incrementt:1-n,infinite[无穷次]
-webkit-marquee-speed:fast,normal,slow
-webkit-marquee-style:alternate,none,scroll,slide
CSS定义:-webkit-text-fill-color:#ff6600;   常量:capitalize, lowercase, none, uppercase
CSS定义:-webkit-text-security:circle;   常量:circle,disc,none,square
CSS定义:-webkit-text-size-adjust:none;  常量:auto,none;
CSS定义:-webkit-text-stroke:15px #fff;
CSS定义:-webkit-line-break:after-white-space;    常量: normal,after-white-space
CSS定义:-webkit-appearance:caps-lock-indicator;
CSS定义:-webkit-nbsp-mode:space;  常量: normal,space
CSS定义:-webkit-rtl-ordering:logical; 常量:visual,logical
CSS定义:-webkit-user-drag:element; 常量:element,auto,none
CSS定义:-webkit-user-modify:read-write-plaintext-only; 常量:read-write-plaintext-only,read-write,read-only
CSS定义:-webkit-user-select:text; 常量:text,auto,none

9,表格

CSS定义:-webkit-border-horizontal-spacing:2px;
CSS定义:-webkit-border-vertical-spacing:2px;
CSS定义:-webkit-column-break-after:right; 常量:always,auto,avoid,left,right
CSS定义:-webkit-column-break-before:right; 常量:always,auto,avoid,left,right
CSS定义:–webkit-column-break-inside:logical; 常量:avoid,auto
CSS定义:-webkit-column-count:3;
CSS定义:-webkit-column-rule:1px solid #fff; style:dashed,dotted,double,groove,hidden,inset,none,outset,ridge,solid

10,用户接口

CSS定义:-webkit-box-align:baseline,center,end,start,stretch 常量:baseline,center,end,start,stretch
CSS定义:-webkit-box-direction:normal;常量:normal,reverse
CSS定义:-webkit-box-flex:flex_valuet
CSS定义:-webkit-box-flex-group:group_number
CSS定义:-webkit-box-lines:multiple;常量:multiple,single
CSS定义:-webkit-box-ordinal-group:group_number
CSS定义:-webkit-box-orient:block-axis; 常量:block-axis,horizontal,inline-axis,vertical;-webkit-box-orient: orientation;
CSS定义:–webkit-box-pack: alignment; 常量:center,end,justify,start

支持;safari3.0+,iPhone OS 1.0+