CSS優化的認識一二

2021-07-13 10:30:56 字數 780 閱讀 6397

css優化

一、css優化概述

1、css優化的作用

- 減輕伺服器壓力

- 縮短伺服器響應時間

- 提高使用者的體驗度

二、css優化原則

1、儘量減少http請求個數

- css sprites:合併多個背景影象到乙個單獨影象,

然後通過background-image

和background-position進行調整

- image maps,結合對各影象到乙個單獨影象。其總體現規模大致是相當的,但是減少http請求的數量,從而加快頁面顯示速度

2、頁面頂部引入css

- 可以提高頁面載入速度

- 樣式表放在頭部,允許頁面逐步呈現

3、將css和js放到外部檔案中

- 頁面引入外部檔案,將由瀏覽器快取

- 後續頁面會使用快取

三、css**優化

1、合併樣式

- 提前定義統一的樣式

- 利用css繼承

2、縮小樣式檔案

- 盡量使用簡寫屬性

3、選擇更優的樣式屬性值

- 比如,border:none;

4、減少樣式重寫

- 使用reset,但並非全域性reset,比如針對性的清除邊距。

5、**壓縮

- 使用工具壓縮css**

- 比如yuicompressor

6、不要在html中縮放影象

- 影象在網路傳輸時仍然保持原來影象的位元組數

7、避免空的src和href

認識CSS樣式

css全稱為 層疊樣式表 cascading style sheets 它主要是用於定義html內容在瀏覽器內的顯示樣式,如文字大小 顏色 字型加粗等。使用css樣式的乙個好處是通過定義某個樣式,可以讓不同網頁位置的文字有著統一的字型 字型大小或者顏色等。css 樣式由選擇符和宣告組成,而宣告又由屬...

css 認識 引用

css 層疊樣式表,又稱串樣式列表,有w3c定義和維護,一種用來為結構化文件 如html xml 新增樣式 字型 間距 顏色等 的計算機語言。css能夠對網頁中元素位置的排版進行畫素級精確控制,支援所有的字型字型大小樣式,擁有對網 頁的物件和模型樣式編輯的能力,就是美化頁面,做到結構 html 和表...

CSS世界 第一 二章

1.1 css世界的 世界觀 1.2 世界都是創造出來的 1.3 css完勝svg的 流 1.3.1 什麼是 流 實際上是css世界中的一種基本的定位和布局機制。css世界構建的基石是html,而html最具有代表的2個基石和正好是css世界中塊級元素和內聯級元素的代表 1.3.2 流是如何影響整個...