HTML基礎知識點一

2021-08-31 03:02:09 字數 1985 閱讀 8262

ie: trident 核心

firefox:gecko 核心

safari:webkit 核心

opera:以前是presto 核心,opera 現已改用google chrome 的blink 核心

chrome:blink(基於webkit,google 與opera software 共同開發)

宣告位於文件中的最前面的位置,處於 標籤之前。此標籤可告知瀏覽器文件使用哪種html 或xhtml 規範。**(重點:告訴瀏覽器按照何種規範解析頁面)**漸進增強progressive enhancement:針對低版本瀏覽器進行構建頁面,保證最基本的功能,然後再針對高階瀏覽器進行效果、互動等改進和追加功能達到更好的使用者體驗。

優雅降級graceful degradation:一開始就構建完整的功能,然後再針對低版本瀏覽器進行相容。

區別:優雅降級是從複雜的現狀開始,並試圖減少使用者體驗的供給,而漸進增強則是從乙個非常基礎的,能夠起作用的版本開始,並不斷擴充,以適應未來環境的需要。優雅降級(功能衰減)意味著往回看;而漸進增強則意味著朝前看,同時保證其根基處於安全地帶。

(1)、「優雅降級」觀點

「優雅降級」觀點認為應該針對那些最高端、最完善的瀏覽器來設計**。而將那些被認為「過時」或有功能缺失的瀏覽器下的測試工作安排在開發周期的最後階段,並把測試物件限定為主流瀏覽器(如ie、mozilla等)的前乙個版本。在這種設計範例下,舊版的瀏覽器被認為僅能提供「簡陋卻無妨(poor, but passable)」 的瀏覽體驗。你可以做一些小的調整來適應某個特定的瀏覽器。但由於它們並非我們所關注的焦點,因此除了修復較大的錯誤之外,其它的差異將被直接忽略。

(2)、「漸進增強」觀點

「漸進增強」觀點則認為應關注於內容本身。內容是我們建立**的誘因。有的**展示它,有的則收集它,有的尋求,有的操作,還有的**甚至會包含以上的種種,但相同點是它們全都涉及到內容。這使得「漸進增強」成為一種更為合理的設計範例。這也是它立即被yahoo! 所採納並用以構建其「分級式瀏覽器支援(graded browser support)」策略的原因所在。

那麼問題來了。現在產品經理看到ie6,7,8 網頁效果相對高版本現代瀏覽器少了很多圓角,陰影(css3),要求相容(使用背景,放棄css3),你會如何說服他?

(1)、cdn 快取更方便

(2)、突破瀏覽器併發限制

(3)、節約cookie 頻寬

(4)、節約主網域名稱的連線數,優化頁面響應速度

(5)、防止不必要的安全問題

(1)、sessionstorage (session)中的資料

sessionstorage (session)中的資料,這些資料只有在同乙個會話中的頁面才能訪問

並且當會話結束後資料也隨之銷毀。因此sessionstorage 不是一種持久化的本地儲存,僅

僅是會話級別的儲存。而localstorage 用於持久化的本地儲存,除非主動刪除資料,否則

資料是永遠不會過期的。

(2)、web storage 和cookie 的區別

web storage 的概念和cookie 相似,區別是它是為了更大容量儲存設計的。cookie 的大小

是受限的,並且每次你請求乙個新的頁面的時候cookie 都會被傳送過去,這樣無形中浪費

了頻寬,另外cookie 還需要指定作用域,不可以跨域呼叫。

除此之外,web storage 擁有setitem,getitem,removeitem,clear 等方法,不像cookie

需要前端開發者自己封裝setcookie,getcookie。但是cookie 也是不可以或缺的:cookie

的作用是與伺服器進行互動,作為http 規範的一部分而存在,而web storage 僅僅是為

了在本地「儲存」資料而生。

webp 格式,谷歌(google)開發的一種旨在加快載入速度的格式。壓縮體積大約只有jpeg 的2/3,並能節省大量的伺服器頻寬資源和資料空間。facebookebay 等知名**已經開始測試並使用webp 格式。在質量相同的情況下,webp 格式影象的體積要比jpeg 格式影象小40%

HTML基礎知識點

採用中文字符集 常用的編碼格式如下utf 8 是一種字首碼,又稱萬國碼,是一種針對unicode的可變長度字元編碼 gb2312 gb 2312 或 gb 2312 80 是中國國家標準簡體中文字符集,收錄 6763 個漢字,對任意乙個圖形字元都採用兩個位元組表示 gbk gbk即漢字內碼擴充套件規...

html基礎知識點

html基礎知識 display 元素顯示模式 display block 塊級 inline 行內 inlne block margin 設定乙個p元素的所有四個邊距 border 設定邊框 border color邊框顏色 border style邊框風格solid實線 dashed點虛線 do...

基礎知識點

1 inline block布局 2 table布局 3 justify的末行不對齊 4 兩個圖示之間有空格 換行 5 背景中的的 路徑的 全部斜槓都為 不是 命令列下的這種 doctype html html head meta charset utf 8 title xx title head ...