css
1、邊框
1.1邊框的樣式：border:width style color;
1.2邊框四個角的半徑
border-top-left-radius:(top)#px/% (left)#px/%;
border-top-right-radius:
border-bottom-left-radius:
border-bottom-right-radius:
或者直接 border-radius:
1.3邊框陰影
box-shadow:h-shadow(水平陰影的位置) v-shadow（豎直位置） （必需）
blur（模糊距離） spread（陰影尺寸） color(陰影顏色) inset/outset(陰影是在內部還是外部) （可選）
1.4邊框圖形
border-image:下面屬性可以一起賦值在一起，簡寫
border-image-source: url();位址
border-image-slice: 邊框向內偏移量
border-image-width: 邊框的寬度
border-image-outset:邊框影象區域超出邊框的量
border-image-repeat:影象邊框是否應平鋪(repeated)、鋪滿(rounded)或拉伸(stretched)
2、css3背景控制
2.1背景顏色:
background-color:color;
background-clip:content-box/padding-box/border-box;(經過實驗，這個貌似沒有什麼作用)
2.2、背景
background-origin:content-box/padding-box/border-box;
（只用於確定背景用於定位的地方，而不是定位背景）
background:url();其中url中的位址必須是相對於css檔案的位址，而不是相對於html的位址
2.3背景的大小
border-ground-size:width height;
3、新文字效果
text-shadow:h-shadow v-shadow blur（模糊距離） color;
（如果h-shadow和v-shadow都是0的話，相當於陰影和元素重合，如果有值的話（可正可副）則會偏移，然後在使用模糊距離）
word-wrap:normal/break-word(可以使乙個單詞斷開（換行）);
4、4.1 2d轉換效果
使用屬性 transform:(2d/3d轉換都是使用這個)
屬性值：translate(x,y) 沿著x和y移動相應的距離
translatex/y(n)沿著x/y軸移動n的距離
scale(x,y) 在x和y方向縮放x和y倍 如scale(2,4)
scalex/y(n)在x或者y方向縮放n倍
rotate(angle)順時針旋轉angle角度(可正可副) 例如angle=20deg
skew(x-angle,y-angle) 沿著x軸和y軸旋轉相應的角度
skewx/y(angle)旋轉角度
4.2 3d轉換效果
transform:
translate3d(x,y,z)
translatex/y/x(n);
scale3d(x,y,z);
scalex/y/z(n);
rotate3d(x,y,z,angle));
rotatex(angle);
rotatey(angle);
rotatez(angle);
對於不同的瀏覽器
transform:
-ms-transform:(ie)
-webkit-transform:(safari chrome)
-o-transform:(opera)
-moz-transform:(firefox)
css3學習筆記（一）
e f 包含選擇器 包括孫子輩的 e f 子選擇器 不包括孫子輩的 e f 相鄰選擇器 e f 兄弟選擇器 選中e出現的後面的兄弟 中國十大傑出人物 別人家的孩子 別人家的爸爸 別人家的媽媽 別人家的老公 別人家的老婆 別人家的公公 別人家的婆婆 別人家的公司 別人家的領到 別人家的員工 偽類選擇器...
css3學習筆記
1.為什麼分許多模組進行管理？為了避免產生瀏覽器對於某個模組支援不完全的情況。2.使用元素的class屬性的缺點 第一，class屬性本身沒有語義，褚翠是用來為css樣式服務的，屬於多餘屬性。第二，使用屬性的話，並沒有把樣式與元素繫結起來，針對同乙個class屬性文字框，下拉框，按鈕都可使用。這樣很...
CSS3學習筆記
一.選擇符 二.屬性 溢位隱藏 div4 p文字陰影 text shadow 2px 1px rgba 255,255,255,1 圓角效果 border radius邊框陰影 box shadow 2px 2px 5px 5px inset 內陰影透明度 div for ie8 and earli...