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+
分享到:
相关推荐
7. **自定义渲染**:通过继承QWebFrame或QWebPage,可以实现自定义的渲染策略,比如修改CSS样式、添加额外的JavaScript库等。 8. **插件支持**:Qt WebKit支持NPAPI(Netscape Plugin Application Programming ...
WebKit的核心组件包括HTML解析器、CSS样式引擎、JavaScriptCore(JavaScript引擎)和WebCore(负责布局和渲染)。WebKit的设计目标是高效、安全和跨平台,这使得它能够适应不同硬件和操作系统的需求。 2. WebKit ...
5. **style.html**: 这是一个HTML文件,很可能包含了CSS样式,用于定义网页的布局和视觉效果。在QT WebKit中,可以加载这样的本地HTML文件并显示在WebView中。 6. **JavaScript交互**: 虽然没有直接的文件表明这...
在其他平台上,WebKit 可能会使用 Skia 图形库,这是一个由 Google 开发的高性能 2D 图形库,支持多种操作系统。这些图形库允许 WebKit 渲染高质量的文本、图像和复杂的 CSS3 效果,如渐变、阴影和变换。同时,...
- Webkit还提供了Web Inspector,一个强大的调试工具,帮助开发者检查和调试网页元素、样式、网络请求等。 2. **WebKit.Interop.dll** - WebKit.Interop.dll是.NET框架下的一个接口库,允许.NET开发者调用Webkit...
Webkit内核会自动解析HTML源码,并根据CSS样式和布局规则进行渲染。开发者可以通过API获取DOM元素,或者执行JavaScript操作网页内容。 8. **安全和性能考虑**: 当处理网页源码时,需注意潜在的安全风险,如XSS...
CSS的`scrollbar`伪元素和`::-webkit-scrollbar`(Webkit浏览器特有)允许我们自定义滚动条的样式,包括颜色、宽度和形状,从而实现透明或半透明的效果。然而,需要注意的是,这些样式只在支持的浏览器中有效,跨...
WebKit.NET通过提供C#接口,使得.NET开发者可以利用WebKit的强大功能,如HTML5解析、CSS样式、JavaScript执行以及多媒体支持等。 WebKit引擎的核心组件包括: 1. **WebCore**:这是WebKit的主要部分,负责渲染HTML...
例如,使用封装 WebKit 的第三方库(如 Awesomium 或 OpenWebKitSharp),或者利用 P/Invoke 直接调用 WebKit 的 C API。 深入研究 WebKit 的源代码,不仅可以提升对网页渲染和浏览器内核的理解,还能帮助开发者...
7. **布局和样式**:QtWebKit支持CSS样式,可以通过JavaScript或直接修改HTML来调整网页的显示效果。 通过学习和实践这个示例项目,开发者不仅可以掌握QtWebKit的基本用法,还能了解到如何在资源受限的环境中优化...
3. **CSS3支持**: WebKit对CSS3的全面支持,使得开发者可以利用丰富的样式和动画效果创建富有吸引力的网页设计。包括媒体查询、渐变、阴影、旋转等特性,都在WebKit中得到了良好的实现。 4. **HTML5兼容**: WebKit...
4. **图形层处理**:使用Quartz 2D、OpenGL或Metal等图形库,进行2D和3D渲染,确保页面的视觉效果。 5. **渲染树构建**:根据DOM和CSSOM生成渲染树,决定每个元素的样式、位置和大小。 **二、WebKit的关键特性** 1...
2. **HTML解析与呈现**:利用WebKit的强大解析能力,能够准确地显示HTML文档,包括CSS样式、JavaScript交互和多媒体内容。 3. **JavaScript交互**:通过JavaScript引擎,开发者可以实现.NET代码与网页内容的交互,...
对于Firefox、IE/Edge等非Webkit浏览器,我们需要依赖JavaScript库或自定义实现来改变滚动条样式。 1. **纯CSS方法(Webkit兼容)** 对于Webkit浏览器,可以使用以下CSS代码来定制滚动条: ```css textarea::-...
#### WebKit如何支持不同图形库的实现 - **抽象接口**:定义一组通用的绘图API。 - **适配器模式**:根据使用的图形库不同,提供相应的实现。 - **策略模式**:根据运行时条件选择最合适的图形库。 #### WebKit 3D...
WebCore是WebKit的核心库之一,负责处理网页的渲染与解析。其中提到的“WebCore Loader”主要涉及网络加载机制,包括资源加载器(ResourceLoader)、子资源加载器(SubresourceLoader)等相关类。 1. **ResourceHandle*...
在Windows和Linux环境下编译WebKit是一个复杂的过程,需要配置多个依赖项,例如Qt库(如果使用QT编译)、C++编译器、Python工具等。以下是一些关键步骤: 1. **获取源码**:从WebKit官方仓库克隆源码,通常使用Git...
- **图形库概述及其主要功能**:介绍WebKit所使用的图形库(如Cairo),以及这些图形库的主要功能。 - **WebKit与Cairo**:详细阐述WebKit如何与Cairo图形库集成,以及这种集成带来的优势。 - **WebKit如何支持不同...
8. **nw.pak**:这是一个资源包文件,包含了 Chromium 的用户界面资源,如图标、字符串和样式表等。这个文件是编译后的二进制格式,用于减少资源加载时间和提高性能。 **Node.js API 在 Node-WebKit 中的作用** ...
因此,在设计时要考虑兼容性问题,可能需要借助JavaScript库或polyfill来实现跨浏览器的滚动条样式。 10. **实际应用** 在创建响应式设计时,滚动条的样式尤为重要。例如,当屏幕尺寸变小时,可以使用不同的滚动条...