-
background-origin: border-box|padding-box|content-box; 定義背景的起點 border-box 以邊框為起點 padding-box 以填充為起點 (默認值) content-box 以元素內(nèi)容為起點查看全部
-
animation-fill-mode:none/forwards/backwards/both查看全部
-
來看一個斷點解決圖片自適應(yīng)的例子。 <img src=”image.jpg” data-src-600px=”image-600px.jpg” data-src-800px=”image-800px.jpg” alt=”” /> 對應(yīng)的CSS代碼: @media (min-device-width:600px){ img[data-src-600px]{ content: attr(data-src-600px,url); } } @media (min-device-width:800px){ img[data-src-800px] { content:attr(data-src-800px查看全部
-
overflow:hidden; white-space:nowrap; text-overflow:ellipsis;查看全部
-
@font-face { font-family: 字體名稱; src: 字體文件在服務(wù)器上的相對或絕對路徑; }查看全部
-
text-shadow: x y 模糊距離 顏色值; 模糊距離: 單位為px查看全部
-
meta表簽查看全部
-
Responsive布局技巧 通過上面的介紹,大家對響應(yīng)式設(shè)計有了一定的了解,但在實際制作中還是有一些布局技巧的: 在Responsive布局中,可以毫無保留的丟棄: 第一, 盡量少用無關(guān)緊要的div; 第二,不要使用內(nèi)聯(lián)元素(inline); 第三,盡量少用JS或flash; 第四,丟棄沒用的絕對定位和浮動樣式; 第五,摒棄任何冗余結(jié)構(gòu)和不使用100%設(shè)置。 有舍才有得,丟棄了一些對Responsive有影響的東東,那么有哪些東東能幫助Responsive確定更好的布局呢? 第一,使用HTML5 Doctype和相關(guān)指南; 第二,重置好你的樣式(reset.css); 第三,一個簡單的有語義查看全部
-
background: linear-gradient(to 方向,顏色1,顏色2...); 方向 1.left 從右到左 數(shù)值為: 270deg 2.right 從左到右 數(shù)值為: 90deg 3.top 從下到上 數(shù)值為: 0 4.bottom 從上到下 數(shù)值為: 180deg 默認值 左上角 - 右下角 只需填寫右下角名稱即可 例如 linear-gradient(to bottom right,顏色1,顏色2...); 顏色1 為起始顏色 顏色2 為終點顏色 可以設(shè)置2個顏色以上的值,不少于2個查看全部
-
調(diào)用動畫 animation-name 例如: div span { display: inline-block; width: 20px; height: 20px; background: orange; border-radius: 100%; animation-name:around; animation-duration: 10s; animation-timing-function: ease; animation-delay: 1s; animation-iteration-count:infinite; }查看全部
-
過渡延遲時間transition-delay 有時我們想改變兩個或者多個css屬性的transition效果時,只要把幾個transition的聲明串在一起,用逗號(“,”)隔開,然后各自可以有各自不同的延續(xù)時間和其時間的速率變換方式。 例如:a{ transition: background 0.8s ease-in,color 0.6s ease-out;}查看全部
-
實習(xí)上是一種縮寫形式: 語法: border-image: 邊框圖像位置 切割圖片的寬度 圖片延伸方式; 邊框圖像位置: url(); 切割圖片的寬度: 單位為像素,省略px也可以使用百分比,順時針規(guī)律. 圖片延伸方式 3種: 1.round (平鋪) 2.repeat (重復(fù)) 3.stretch (拉伸)查看全部
-
CSS3的過度transition屬性是一個復(fù)合屬性,主要包括以下幾個子屬性: transition-property:指定過渡或動態(tài)模擬的CSS屬性 transition-duration:指定完成過渡所需的時間 transition-timing-function:指定過渡函數(shù) transition-delay:指定開始出現(xiàn)的延遲時間查看全部
-
改變原點位置:transform-origin transform-origin:left top; 改變原點位置到左上角查看全部
-
經(jīng)測試,只有Firefox支持較好查看全部
舉報
0/150
提交
取消