webkit Safari的样式库
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+
webkit Safari的样式库的更多相关文章
- 精简的网站reset 和 css通用样式库
参考链接:http://www.zhangxinxu.com/wordpress/2010/07/我是如何对网站css进行架构的/ reset.css body{ line-height:1.4; c ...
- Sass 默认样式库
Sass 默认初始化样式库 @charset "utf-8"; // 变量存储 // 字体Unicode编码 微软雅黑:\5FAE\8F6F\96C5\9ED1 , 宋体:\5B8 ...
- Mockplus组件样式库一键解决风格复用
在Mockplus3.3版本中,新增了组件样式库,可以快速复用组件风格,同时可以将组件风格保存到库中. 官网地址:https://www.mockplus.cn 1. 保存样式 选中组件,设置好该组件 ...
- 一个有意思的CSS样式库--BUTTONS
我最近发现了一个有意思的CSS样式库,和Bootstrap相似,但是它是专门的一个高度可定制的,免费的并且开源的按钮CSS样式库,这里附上它的网址:http://www.bootcss.com/p/b ...
- 精简的网站reset和css通用样式库
一.CSS reset body{ line-height:1.4; color:#; font-family:arial; font-size: 12px; } input,textarea,sel ...
- 使用sass语法生成自己的css的样式库
前言 先说一下 sass 和 scss的区别 sass 是一种缩进语法(即没有花括号和分号,只使用换行 缩进的方式去区别子元素,PS:这是我个人的理解) scss 是css-like语法 (它的语法 ...
- WeUI基础样式库——写一个移动端界面
WeUI是一套基础样式库,同微信原生视觉体验一致,由微信官方设计团队为微信内网页和微信小程序量身设计的.我们来看看这个基础库样式到底长什么样. 这些密密麻麻的就是压缩后的样式库.密密麻麻地看起来简直要 ...
- 自定义webkit搜索框样式
好吧,这是个有点儿蛋疼的文章,每个浏览器都可以有自己的行为和表现,只是webkit在apple的带领下,在UI上走的更远了一点儿,但是却给我们带来了点儿困扰,因为很多情况下,我们希望搜索框在所有的浏览 ...
- 【学习】苹果iPhone safari浏览器样式重置修复按钮圆角bug
iPhone safari浏览器中,input按钮会按苹果的默认UI来渲染,例如,写的按钮明明是这个样的: 但是实际就会是这个样子: 怎么办呢? 为按钮添加:-webkit-appearance: n ...
随机推荐
- POJ 3624 Charm Bracelet【01背包】
解题思路:直接套公式就能做的01背包, for(i=1;i<=n;i++) { for(v=w[i];v<=m;v++) f[i,v]=max(f[i,v],f[i-1,v-w[i]]+d ...
- How an Event Enters a Cocoa Application
How an Event Enters a Cocoa Application An event is a low-level record of a user action that is usua ...
- 第十一章 Python之异常处理
异常 异常时程序运行时发生错误的信号(在程序错误时,则会产生一个异常,若程序没有处理,则会抛出该异常,程序的运行也随之终止) 常见的异常类型AttributeError 试图访问一个对象没有的树形,比 ...
- css3背景渐变以及图片混合渲染模式(一)
一.CSS3 渐变(Gradients):CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡. 以前,你必须使用图像来实现这些效果.但是,通过使用 CSS3 渐变(g ...
- Java根据当前日期获得昨天的当前日期代码实现
代码: import java.text.SimpleDateFormat; import java.util.Date; /** * 根据当前日期获得昨天的当前日期 * @author jinghu ...
- 【转】Retina 屏幕下,网页图片的显示兼容
感谢 Apple,带来了 Retina 屏幕的革命,让我们可以在电子显示屏上享受到印刷级的分辨率.由于分辨率的提升,网页中的文字.Flash 和 SVG 内容显示得比原来更加精细,但网页中的图片却变得 ...
- Vue学习之路第四篇:v-html指令
上一篇我们讲解了两种方式,把Vue对象的数据展示在页面上: 1.插值表达式 2.v-text指令 但是如果我们展示的数据包含元素标签或者样式,我们想展示标签或样式所定义的属性作用,该怎么进行渲染,比如 ...
- git--客户端管理工具初步使用
说点废话哈 小白一枚, 今年3月份进入自己的第一家公司, 开始成为前端中的一份子,好在公司里有位和我一同进来的一位老哥带着我,从老哥身上学到的知识不多,(因为和老哥只相处工作了三个月,因为家里的事情, ...
- JavaScript 实现留言框
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- NOIP2018提高组省一冲奖班模测训练(三)
NOIP2018提高组省一冲奖班模测训练(三) 自己按照noip的方式考,只在最后一两分钟交了一次 第一题过了,对拍拍到尾. 第二题不会.考试时往组合计数的方向想,推公式,推了一个多小时,大脑爆炸,还 ...