css3有哪些新特性,求詳解,css3新特性有哪些

2023-03-02 02:40:15 字數 4179 閱讀 8619

1樓:漲姿勢了嗎

圓角這個功能已經在諸如mozilla,webkit等瀏覽器廣泛使用,對web設計者來說無疑是最受期待的,然而ie仍然沒有要支援這個功能的跡象。

多背景這個功能是我最期待的,但向後相容會是一個很大的問題。

@font-face

firefox的最新版本將支援該功能,safari,opera甚至ie也將支援或已經支援該功能,我們會看到該功能的廣泛應用,只是字型的版權問題會很麻煩。

動畫與漸變

webkit在這方面是領頭軍,動畫也是設計的一部分,也該屬於css。這些會慢慢實現,當webkit之外的瀏覽器也開始支援這個功能,我們會看到很多令人驚訝的效果。

漸變色定義一個固定色背景很簡單,但漸變色就沒有那麼簡單了,漸變色很適合通過**實現,webkit又在這方面搶了先。

box陰影

陰影也是一種漸變色,以往是通過背景**實現的,如果考慮到多方向的陰影,事情會變得更復雜,box陰影機制讓一切問題迎刃而解。

rgba-加入透明色

rgba中的a代表透明色,透明對設計者來說非常重要,目前除了ie,這一功能正在被廣泛採用。

文字陰影

也屬於漸變色的概念,讓文字擁有陰影,以前甚至無法通過**背景實現,因此這將為設計者帶來前所未有的方便。

另外這些新的特新需要考慮相容性問題。

2樓:布吉島深深

去菜鳥教程**去看,**都有

css3新特性有哪些

3樓:久就舊

css3 新特性

包括css3 選擇器(selector)

@font-face 特性、

word-wrap & text-overflow 樣式text-decoration

多列布局(multi-column layout)邊框和顏色,顏色支援透明度(color, border)漸變效果(gradient)

陰影(shadow)和反射(reflect)效果盒子模型

transitions, transforms 和 animation

比如:@font-face 特性

@font-face

@font-face

.border

.event

更多參考

4樓:中公教育it培訓優就業

一、rgba和透明度

rgba是rgb色彩模型的一個擴充套件。在本質上看也是為設定的元素增加了一個 alpha 通道,即除了紅綠藍三種顏色外還增加一個代表透明度的通道,其中 rgb 值分別表示紅色、綠色、藍色,而 alpha 取值則為 0 到 1 (小數位一位)。

二、background屬性

background-image:設定元素的背景影象。

background-origin:規定背景**的定位區域。

background-size :規定背景**的尺寸。

background-repeat:設定是否及如何重複背景影象。

三、word-wrap屬性

word-wrap 屬性允許長單詞或 url 地址換行到下一行。

注:所有主流瀏覽器都支援 word-wrap 屬性。

基礎語法:

word-wrap: normal|break-word;

四、text-shadow屬性

text-shadow 屬性:向文字設定陰影。

text-shadow基礎語法:

text-shadow: 5px 5px 5px #ff0000;

引數分別表示:水平陰影,垂直陰影,模糊距離,陰影顏色;

五、font-face屬性

font-face屬性:定義自己的字型

在新的 @font-face 規則中,您必須首先定義字型的名稱(比如 myfirstfont),然後指向該字型檔案。

六、border-radius屬性

border-radius 屬性:是一個簡寫屬性,用於設定四個 border-*-radius 屬性。

基礎語法:

border-radius: 1-4 length|% / 1-4 length|%;

注:該屬性允許您為元素新增圓角邊框!

七、border-image屬性

border-image:將**規定為包圍 div 元素的邊框

border-image基礎語法:

border-image: url(border.png) 30 30 round

八、box-shadow屬性

box-shadow屬性:向框新增一個或多個陰影。(盒陰影)

box-shadow基礎語法:

box-shadow: 10px 10px 5px #888888

九、**查詢

**查詢定義兩套css,當瀏覽器的尺寸變化時會採用不同的屬性。

css3有哪些新特性 包含哪些模組

h5和css3有哪些新特性?

css3都有哪些新特性呢?

5樓:勿忘心安

第 1 選擇器

第 2 rgba和透明度

第 3 多欄佈局

第 4 多背景圖

第 5 word wrap

第 6 文字陰影

第 7 @font-face屬性

第 8 圓角(邊框半徑)

第 9 邊框**

第 10 盒陰影

第 11 盒子大小

第 12 **查詢

第 13 語音

6樓:雲南新華電腦學校

選擇器rgba和透明度

多欄佈局

多背景圖

word wrap

文字陰影

@font-face屬性

圓角(邊框半徑)

邊框**

盒陰影盒子大小

**查詢語音

css3有哪些新特性

7樓:夢想愛但丁

第 1 選擇器

第 2 rgba和透明度

第 3 多欄佈局

第 4 多背景圖

第 5 word wrap

第 6 文字陰影

第 7 @font-face屬性

第 8 圓角(邊框半徑)

css3有哪些新特性?包含哪些模組?

css3哪些新特性值得稱讚

8樓:青鳥中關村專家

簡單的說,css3把很多以前需要使用**和指令碼來實現的效果,只需要短短几行**就能搞定。

1、css進行漸變背影的設定,在background中新增了linear-gradient線性漸變,

background: linear-gradient(yellow 0%, #000 80%); /*從0%黃色到80%黑色的漸變*/

2、css 3d

perspective:檢視檢視的位置,如拍照時的鏡頭位置一樣。

transform-style中preserve-3d,設定了此屬性時,將子元素包裹在一個3d檢視裡。

3、css animation

說到動畫就不得不說jquery的animation。但有了css3後就再也不用js進行製作動畫了。

keyframes定義幀動畫,可根據百分比進行設定,也可利用from和to的方式進行設定。

利用animation引用定義好的keyframes幀動畫。animation:rotate 20s infinite linear; /*設定引用的動畫,動畫時間,動畫的timing-function,動畫方式*/

4、css filter

fileter並非ie的過濾器,是css3中新新增的屬性。

包含效果有:grayscale灰度,sepia褐色,saturate飽和度,hue-rotate色相旋轉,invert反色,opacity透明度,brightness亮度,contrast對比度,blur模糊,drop-shadow陰影.

擠壓效果就是利用filter中的blur加saturate混合而來

h5和css3有哪些新特性

css3過渡和動畫的區別詳解,css3過渡和css3動畫製作的動畫有什麼區別

css3動畫 可以自定義節點改變屬性,例如30 40 這種節點式定義屬性的狀態值,相對過度來說,可以把一系列的屬性變化按照順序節點來執行,這就好比把動畫封裝成了一個 函式 既可以共用,又可以根據改變html標籤元素的class來增加或者刪除動畫效果,動畫最好用在寫複雜效果的時候用,或者有定義觸發一個...

詳解CSS3特性Media如何實現響應式設計

舉個例子 media screen and min width 800px 分辨抄率800以上bai screen 手機或者所有電腦使用者 mian的 du 高跟zhi寬變成200畫素,這個很dao簡單的。網頁連結 可以去這裡看看 如何利用css3中 media實現響應式佈局 響應式抄佈局,說穿了就...

怎麼讓ie支援css3的animation動畫放大效果

ie8 ms filter progid dximagetransform.microsoft.matrix m11 2,m12 0,m21 0,m22 2,sizingmethod auto expand ie6 ie7 filter progid dximagetransform.microso...