1.css3邊框
圓角邊框 border-radius: 5px;(圓角半徑)
邊框陰影 box-shadow: 10px 10px 5px red;(水平陰影?垂直陰影?模糊距離?陰影的尺寸?陰影顏色?內(nèi)陰影)
邊框圖片?border-image: url() 30 30 round; -moz-border-image:..;-webkit-border-image:...;-o-border-radius:..;
2.CSS3背景
```background-size: 100%; 100%；```
background-origin?定位區(qū)域 （padding-box border-box content-box）
3.CSS3文本效果
文本陰影 text-shadow: 5px 5px 5px red; (水平陰影 垂直陰影 模糊距離 陰影的顏色)
文本換行 word-wrap: break-word; //對(duì)長(zhǎng)單詞進(jìn)行拆分、并換行
文本溢出?text-overflow濒生；斷點(diǎn)字換行 word-break: break-all;文本換行?text-wrap: none;
4.CSS 2D字體
5.CSS 轉(zhuǎn)換
{transform: rotateX(120deg);-webkit-transform: rotateX(120deg);/* Safari 和 Chrome */-moz-transform: rotateX(120deg);
2D轉(zhuǎn)換屬性：
translate(50px 100px) // 距離left top 移動(dòng)? translateX(50px) translateY(50px)
rotate(30deg)//順時(shí)針旋轉(zhuǎn)30度
scale(2,4)//尺寸變?yōu)樵瓉?lái)的寬的2倍雪位，高的4倍 scaleX(2) scaleY(4)
skew(30deg, 20deg)//根據(jù)X軸 Y軸翻轉(zhuǎn) skewX30deg) skewY20deg)
matrix()//matrix() 方法需要六個(gè)參數(shù)，包含數(shù)學(xué)函數(shù)秽荞，允許旋轉(zhuǎn)阀蒂、縮放、移動(dòng)以及傾斜元素。
3D轉(zhuǎn)換屬性：
transform: rotateX(120deg);
transform: rotateY(20deg);
6.CSS3過(guò)渡
{transition: width 2s;-moz-transition: width 2s;/* Firefox 4 */-webkit-transition: width 2s;/* Safari 和 Chrome */-o-transition: width 2s;/* Opera */}
CSS3 過(guò)渡是元素從一種樣式逐漸改變?yōu)榱硪环N的效果计济。
要實(shí)現(xiàn)這一點(diǎn)罩引，必須規(guī)定兩項(xiàng)內(nèi)容： 規(guī)定您希望把效果添加到哪個(gè) CSS 屬性上;規(guī)定效果的時(shí)長(zhǎng)
7.CSS3動(dòng)畫
@keyframe定義動(dòng)畫
@keyframe myfirst{
? ? form{background: red;}
? ? to{background: green;}
}
div{
anination: myfirst 5s各吨；
}
