第1章 初識CSS3

2022-09-15 21:54:32 字數 1770 閱讀 4064

css3是css2的公升級版本,3只是版本號,它在css2.1的基礎上增加了很多強大的新功能。 目前主流瀏覽器chrome、safari、firefox、opera、甚至360都已經支援了css3大部分功能了,ie10以後也開始全面支援css3了。

在編寫css3樣式時,不同的瀏覽器可能需要不同的字首。它表示該css屬性或規則尚未成為w3c標準的一部分,是瀏覽器的私有屬性,雖然目前較新版本的瀏覽器都是不需要字首的,但為了更好的向前相容字首還是少不了的。

字首瀏覽器

-webkit

chrome和safari

-moz

firefox

-msie

-oopera

css3給我們帶來了什麼好處呢?簡單的說,css3把很多以前需要使用和指令碼來實現的效果、甚至動畫效果,只需要短短幾行**就能搞定。比如圓角,邊框,文字陰影和盒陰影,過渡、動畫等。

css3簡化了前端開發工作人員的設計過程,加快頁面載入速度。

css3都有哪些強大功能呢?各位小夥伴們先來一睹為快吧!

選擇器以前我們通常用class、 id 或 tagname 來選擇html元素,css3的選擇器強大的難以置信。它們可以減少在標籤中的class和id的數量更方便的維護樣式表、更好的實現結構與表現的分離。

圓角效果

以前做圓角通常使用背景,或繁瑣的元素拼湊,現在很簡單了 border-radius 幫你輕鬆搞定。

塊陰影與文字陰影

可以對任意div和文字增加投影效果。

色彩css3支援更多的顏色和更廣泛的顏色定義。新顏色css3支援hsl , cmyk ,hsla and rgba。

漸變效果

以前只能用photoshop做出的漸變效果,現在可以用ccs寫出來了。ie中的濾鏡也可以實現。

個性化字型

網頁上的字型太單一?使用@font-face 輕鬆實現定製字型。

多背景圖

乙個元素上新增多層背景。

邊框背景圖

邊框應用背景。

變形處理

你可以對html元素進行旋轉、縮放、傾斜、移動、甚至以前只能用j**ascript實現的強大動畫。

多欄布局

可以讓你不用使用多個div標籤就能實現多欄布局。瀏覽器解釋這個屬性並生成多欄,讓文字實現乙個仿報紙的多欄結構。

**查詢

針對不同螢幕解析度,應用不同的樣式。

等等 ……

很神奇吧!css3使**更簡潔、更高效。可以極大的提高工作效率,打造更高階的使用者體驗。使web應用的介面設計進入乙個新的台階。

《CSS3秘籍》第6 7章

第六章 文字格式化 1 字型 1 serif字型 適用於冗長的文字資訊,包括 times times new roman georgia 2 sans serif字型 適用於標題,包括 arial helvetica verdana 3 monospaced字型 適用於計算機 字型中每個字母都是等寬...

第 22 章 CSS3 漸變效果

學習要點 1.線性漸變 2.徑向漸變 主講教師 李炎恢 本章主要 html5 中 css3 背景漸變功能,主要有兩種漸變方式 線性漸變和徑向 放射性 漸變。一 線性漸變 linear gradient 方位,起始色,末尾色 方位可選引數,漸變的方位。可以使用的值有 to top to top rig...

第1章 初識hadoop

我們生活在資料時代,每天都有大量的資料在產出,但這些資料怎麼儲存 使用就變的非常重要的 乙個資料不被使用那這份資料就是死資料 現在我們的磁碟讀速度100m s 如果讀10t 的資料需要 10 1000 1000 m 100m 30個小時 那這樣的速度肯定是不可取的,一種簡單的辦法就是把資料儲存在多台...