1. 程式人生 > >Safari參考樣式庫之webkit

Safari參考樣式庫之webkit

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;

webkit1
★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)

 webkit3
★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

webkit456

★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

webkit78

★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

webkit90
支援;safari3.0+,iPhone OS 1.0+

相關推薦

Safari參考樣式webkit

Safari和WebKit實施大子的CSS 2.1規格所界定的全球資訊網聯盟( W3C ) ,以及部分的CSS 3規格。 。 這個CSS屬性本條劃分的群體界定由W3C的CSS規格: *“盒模型”的具體描述性質的包圍盒塊內容,包括邊界,填充,和利潤率。附加框相關屬性的特定表中分別介紹了“表。 ”*“視覺格式化

CSS3自定義滾動條樣式 -webkit-scrollbar

selection 單獨 窗口 請求 方塊 利用 源碼 bsp 進行 有沒有覺得瀏覽器自帶的原始滾動條很不美觀,同時也有看到很多網站的自定義滾動條顯得高端,就連chrome32.0開發板都拋棄了原始的滾動條,美觀多了。那webkit瀏覽器是如何自定義滾動條的呢? 前言

微信公眾號開發樣式

微信作為一款聊天工具;在中國來說應該是家喻戶曉的了;微信在qq橫行的時代異軍突起靠的是什麼?下面我們來了解一下微信公眾號的開發; 想要開發微信,我們最先要準備的開發工具莫過於一個伺服器;有了伺服器,我們才能隨意的為公眾號;新增功能; 下面;我們在伺

swt學習WEBKITSafari問題

最近做一個專案,需要用到swt,之前都是swing或者awt,根本不瞭解swt。 網上關於swt的資料很少,有人甚至收swt已經日薄西山了。 這是百度的解釋: 這是維基百科的解釋: 這是討論swt的部落格: 好在基礎比較好,所以看了一下基本就略懂了。 但是到了真正做專

前端 | vue.js系列教程4整合Element樣式

很多小夥伴在剛開始接觸前端基礎之一的css的時候會苦於它的屬性不正交的特性,阻礙重重。 那麼今天我們試下引入外部ui庫,用別人已經封裝好的樣式,可以讓我們騰出更多時間去”偷懶”。 首先先給大家奉獻技術哥在網上找到的vue開源專案庫,裡面ui庫、基於vue開發

微信UI設計WeUI前端樣式

WeUIWeUI 是一套同微信原生視覺體驗一致的基礎樣式庫,由微信官方設計團隊為微信內網頁和微信小程式量身設計,令使用者的使用感知更加統一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素框

Mysql學習十二:JDBC連接數據DriverManager方法

url state 種類 delet rom 條件 管理系 ont into JDBC連接數據庫 ?創建一個以JDBC連接數據庫的程序,包括7個步驟: 1、載入JDBC驅動程序: 在連接數據庫之前。首先要載入想要連接的數據庫的驅動到JVM

數據Oracle(二)

to_char jpg nbsp 數字 立即執行 style begin 高級 會有 上文中對於oracle數據庫做了一些介紹,本文中將主要著重介紹在數據庫開發中運用到的知識,比如字符串的格式轉換,還有存儲過程的書寫,高級連接等 一:存儲過程     存儲過程是為了更加

數據Oracle(一)

篩選 trim bst 新建 最大的 rsquo users 編輯 自帶   前段時間項目中需要做數據管理和遷移的工作,於是又重新拾起了數據庫,在javaEE階段,我們對於數據庫的使用僅限於DML(insert,update,delete,select)。數據庫的使用

爬蟲BeautifulSoup學習(二)

不必要 baidu html left 官方 blank 正則 文本處理 比較 BeautifulSoup官方介紹文檔:https://www.crummy.com/software/BeautifulSoup/bs4/doc/index.zh.html 四大對象種

爬蟲BeautifulSoup學習(三)

子節點 rom lac repr 文檔 strong 爬蟲 time contents 遍歷文檔樹:   1、查找子節點   .contents     tag的.content屬性可以將tag的子節點以列表的方式輸出。   print soup.body.cont

爬蟲BeautifulSoup學習(四)

所有 字符串 判斷 href gin int 過濾器 amp link 探索文檔樹: find_all(name,attrs,recursive,text,**kwargs) 方法搜索當前tag的所有tag子節點,並判斷是否符合過濾器的條件 1、name參數,可

ege圖形動畫排序

lips 做的 選擇排序 lod 代碼 運動 rgb ans get 老師布置了一個學習ege圖形庫來做動畫排序的小動畫程序,這是我自己做的效果。由於個人水平有限,可能代碼有些地方可以改進。不足之處敬請指出。 註:要運行該代碼需要正確配置,連接好ege圖形庫的頭文件,做好準

多媒體開發 SDL 詳解

詳解 lang 模擬 llb 創建 mac os 視頻 內置 bsp SDL 簡介 SDL(Simple DirectMedia Layer)是一套開放源代碼的跨平臺多媒體開發庫,使用C語言寫成。SDL提供了數種控制圖像、聲音、輸出入的函數,讓開發者只要用相同或是相似的代碼

python標準【socket】

yun lock .cn 函數返回 targe ddr 是個 進程間的通信 log socket通常也稱作”套接字“。網絡上的兩個程序通過一個雙向的通信連接實現數據的交換,這個連接的一端稱為一個socket。socket 是網絡連接端點。例如當你的W

數據Case When

data- 沒有 lec 的人 返回 bsp end 中國 .net 近期幾天的工作本來組長是安排我用mindfocion畫幾個圖,本來以為難點是這個控件的使用,可是開發的時候才發現由於數據量有點多,所以在開發的時候匯總這些信息倒是費了我許多的功夫,最後總

C++ pb_dshash

lan 有一個 spa 代碼簡潔 nbsp com bsp map 數據 pb_ds庫之hash 最近在做hash的模板題,自己手打的的hash代碼長還容易出錯。 但STL中有一個pb_ds庫,裏面的hash函數和手打的hash速度差不多,比STL中的map快多了。 與大

互聯網級監控系統必備-時序數據Influxdb技術

範圍 算術 變化 tag time int curl index 服務 時間序列數據庫,簡稱時序數據庫,Time Series Database,一個全新的領域,最大的特點就是每個條數據都帶有Time列。 時序數據庫到底能用到什麽業務場景,答案是:監控系統。 Baidu

java 基礎類 SQLFun

cnblogs import bsp 轉換 span pre param ack urn package com.exjor.webdemo; import java.sql.Timestamp; import java.util.Date; public

java 基礎類 FormatFun

final mat web port efault div break orm log package com.exjor.webdemo; import java.text.SimpleDateFormat; import java.util.Date;