CSS3是CSS的升級版本，引入了許多新的屬性，其中一些是獨(dú)有的。下面介紹幾個(gè)CSS3獨(dú)有的屬性：

/* box-sizing */
/* 作用：改變盒模型的計(jì)算方式 */
/* 取值：content-box（默認(rèn)），border-box */
div{
box-sizing: border-box;
width: 200px;
padding: 10px;
border: 1px solid black;
}

box-sizing屬性用來改變盒模型的計(jì)算方式，由于傳統(tǒng)的盒模型計(jì)算width時(shí)只包括content的寬度，還要加上padding和border的寬度，這樣經(jīng)常會導(dǎo)致布局出現(xiàn)問題，而使用border-box來計(jì)算時(shí)會把padding和border的寬度也計(jì)算在內(nèi)，計(jì)算更加直觀。

/* transition */
/* 作用：定義過渡效果 */
/* 取值：過渡的屬性，過渡時(shí)間，過渡類型 */
div{
width: 100px;
height: 100px;
background-color: red;
transition: width 1s ease-in-out;
}
div:hover{
width: 200px;
}

transition屬性可以定義元素的過渡效果，常用于鼠標(biāo)懸停效果。可以定義過渡的屬性、過渡的時(shí)間和過渡的類型，比如這段代碼中的過渡效果是元素的寬度改變，過渡時(shí)間是1秒，過渡類型是先慢后快再慢。

/* border-radius */
/* 作用：設(shè)置邊框的圓角 */
/* 取值：圓角的大小 */
div{
border: 1px solid black;
border-radius: 10px;
}

border-radius屬性可以設(shè)置邊框的圓角，可以通過一個(gè)值來設(shè)置四個(gè)角的圓角大小，也可以分別設(shè)置每個(gè)角的圓角大小。使用border-radius屬性可以讓邊框看起來更加圓潤。