字首
瀏覽器-webkit
chrome和safari
-moz
firefox
-msie
-oopera
上圖是各大瀏覽器的相容
圓角效果：border-radius;陰影效果：box-shadow; 例： box-shadow:4px 2px 6px #f00, -4px -2px 6px #000 , 0px 0px 12px 5px #33cc00 inset;
邊框： border-image:url("")15 round;
半透明背景：background-color:rgba(255,255,255,0.5);
漸變色彩: 線性漸變 - background-image:linear-gradient(to top left,#fff,#999);
徑向漸變 - background-image:radial-gradient(circle, #f00, #ff0, #080);
文字溢位省略號： text-overflow:ellipsis; (clip:為剪下)
overflow:hidden;
white-space:nowrap;
文字是否換行： word-wrap:normal | break-word;
嵌入字型： @font-face
文字陰影： text-shadow: 2px 2px 0 red;
背景： 設定背景的原始起始位置 - background-origin: border-box | padding-box | content-box;(必須是repeat)
裁剪背景 - background-clip : border - box;
背景大小 - background-size: auto | 長度值 | 百分比 | cover | contain;
組合寫法 - background: url() no-repeat right bottom /150px 70px;
css3選擇器：屬性選擇器：
結構性偽類選擇器
根選擇器（-root）： ：root
否定選擇器（:not）: div:not([id="footer"])
空選擇器（:empty): div:empty
目標選擇器(target): #id:target p
父元素的第乙個子元素(:first-child): ul > li:first-child
父元素的最後乙個元素(:last-child): ul >li:last-child
父元素的乙個或多個特定的子元素（:nth-child(n)）: ol > li:nth-child(2n+1)
父元素的乙個或多個特定倒數的子元素(:nth-last-child(n))
指定元素的型別的父元素的第乙個子元素（first-of-type）: .class > div:first-of-type
指定元素的型別的父元素的乙個或多個子元素(:nth-of-type}
指定元素的型別的父元素的乙個或多個倒數的子元素(last-of-type}
瀏覽器相容 CSS3 選擇器
ie大小寫無關係 去掉間的間距 font size 0px word spacing 0px 數值px float 透明 opacity 數值 0 1 被設定的元素整體透明度 element element 如 div p 只選擇div裡邊的第一代p元素.element element 如 li l...
CSS3 瀏覽器相容
css 3中 moz ms webkit和 o分別代表什麼意思 1 moz 代表firefox瀏覽器私有屬性 2 ms 代表ie瀏覽器私有屬性 3 webkit 代表safari chrome瀏覽器私有屬性 4 o 代表opera瀏覽器私有屬性 手機等小螢幕手持裝置 media screen and...
css3 選擇器 CSS3選擇器
子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素，則不會被選擇。符號之前書寫父級的選擇器，符號之後寫子級選擇器，必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...