2017.2.12 HTML/CSS有感2
阿新 • • 發佈：2019-01-20
每個HTML檔案裡開頭都有個很重要的東西，Doctype，知道這是幹什麼的嗎？
宣告位於文件中的最前面的位置，處於標籤之前。此標籤可告知瀏覽器文件使用哪種 HTML 或 XHTML 規範。（重點：告訴瀏覽器按照何種規範解析頁面）
說說你對HTML5認識?（是什麼,為什麼）
是什麼：
HTML5指的是包括 HTML 、 CSS 和 JavaScript 在內的一套技術組合。它希望能夠減少網頁瀏覽器對於需要外掛的豐富性網路應用服務（ Plug-in-Based Rich Internet Application ， RIA ），例如： AdobeFlash 、 Microsoft Silverlight 與 Oracle JavaFX 的需求，並且提供更多能有效加強網路應用的標準集。 HTML5 是 HTML 最新版本， 2014 年 10 月由全球資訊網聯盟（ W3C ）完成標準制定。目標是替換 1999 年所制定的 HTML 4.01 和 XHTML 1.0 標準，以期能在網際網路應用迅速發展的時候，使網路標準達到匹配當代的網路需求。
為什麼：
HTML4陳舊不能滿足日益發展的網際網路需要，特別是移動網際網路。為了增強瀏覽器功能 Flash 被廣泛使用，但安全與穩定堪憂，不適合在移動端使用（耗電、觸控、不開放）。
HTML5增強了瀏覽器的原生功能，符合 HTML5 規範的瀏覽器功能將更加強大，減少了 Web 應用對外掛的依賴，讓使用者體驗更好，讓開發更加方便，另外 W3C 從推出 HTML4.0 到 5.0 之間共經歷了 17 年， HTML 的變化很小，這並不符合一個好產品的演進規則。
對WEB標準以及W3C的理解與認識?
標籤閉合、標籤小寫、不亂巢狀、提高搜尋機器人搜尋機率、使用外 鏈css和 js 指令碼、結構行為表現的分離、檔案下載與頁面速度更快、內容能被更多的使用者所訪問、內容能被更廣泛的裝置所訪問、更少的程式碼和元件，容易維護、改版方便，不需要變動頁面內容、提供列印版本而不需要複製內容、提高網站易用性。
HTML5行內元素有哪些,塊級元素有哪些, 空元素有哪些?
(1)行內元素
a - 錨點
* abbr - 縮寫
* acronym - 首字
* b - 粗體 ( 不推薦 )
* bdo - bidi override
* big - 大字型
* br - 換行
* cite - 引用
* code - 計算機程式碼 ( 在引用原始碼的時候需要 )
* dfn - 定義欄位
* em - 強調
* font - 字型設定 ( 不推薦 )
* i - 斜體
* img - 圖片
* input - 輸入框
* kbd - 定義鍵盤文字
* label - 表格標籤
* q - 短引用
* s - 中劃線 ( 不推薦 )
* samp - 定義範例計算機程式碼
* select - 專案選擇
* small - 小字型文字
* span - 常用內聯容器，定義文字內區塊
* strike - 中劃線
* strong - 粗體強調
* sub - 下標
* sup - 上標
* textarea - 多行文字輸入框
* tt - 電傳文字
* u - 下劃線
* var - 定義變數
(2)塊元素 (block element)
* address - 地址
* blockquote - 塊引用
* center - 舉中對齊塊
* dir - 目錄列表
* div - 常用塊級容易，也是 css layout 的主要標籤
* dl - 定義列表
* fieldset - form控制組
* form - 互動表單
* h3 - 大標題
* h4 - 副標題
* h3 - 3級標題
* h4 - 4級標題
* h5 - 5級標題
* h6 - 6級標題
* hr - 水平分隔線
* isindex - input prompt
* menu - 選單列表
* noframes - frames可選內容，（對於不支援 frame 的瀏覽器顯示此區塊內容
* noscript - ）可選指令碼內容（對於不支援 script 的瀏覽器顯示此內容）
* ol - 排序表單
* p - 段落
* pre - 格式化文字
* table - 表格
* ul - 非排序列表
可變元素
可變元素為根據上下文語境決定該元素為塊元素或者內聯元素。
* applet - java applet
* button - 按鈕
* del - 刪除文字
* iframe - inline frame
* ins - 插入的文字
* map - 圖片區塊 (map)
* object - object物件
* script - 客戶端指令碼
(3)空元素 ( 在 HTML[1] 元素中，沒有內容的 HTML 元素被稱為空元素 )
<br/> //換行
<hr> //分隔線
<input> //文字框等
<img> //圖片
<link> <meta>
什麼是WebGL,它有什麼優點?
WebGL（全寫 Web Graphics Library ）是一種 3D 繪圖標準，這種繪圖技術標準允許把 JavaScript 和 OpenGL ES 2.0 結合在一起，通過增加 OpenGL ES 2.0 的一個 JavaScript 繫結， WebGL 可以為 HTML5 Canvas 提供硬體 3D 加速渲染，這樣 Web 開發人員就可以藉助系統顯示卡來在瀏覽器裡更流暢地展示 3D 場景和模型了，還能建立複雜的導航和資料視覺化。顯然， WebGL 技術標準免去了開發網頁專用渲染外掛的麻煩，可被用於建立具有複雜 3D 結構的網站頁面，甚至可以用來設計 3D 網頁遊戲等等。
WebGL完美地解決了現有的 Web 互動式三維動畫的兩個問題：
第一，它通過HTML指令碼本身實現 Web 互動式三維動畫的製作，無需任何瀏覽器外掛支援 ;
第二，它利用底層的圖形硬體加速功能進行的圖形渲染，是通過統一的、標準的、跨平臺的OpenGL介面實現的。
通俗說WebGL中 canvas 繪圖中的 3D 版本。因為原生的 WebGL 很複雜，我們經常會使用一些三方的庫，如 three.js 等，這些庫多數用於 HTML5 遊戲開發。
宣告位於文件中的最前面的位置，處於標籤之前。此標籤可告知瀏覽器文件使用哪種 HTML 或 XHTML 規範。（重點：告訴瀏覽器按照何種規範解析頁面）
說說你對HTML5認識?（是什麼,為什麼）
是什麼：
HTML5指的是包括 HTML 、 CSS 和 JavaScript 在內的一套技術組合。它希望能夠減少網頁瀏覽器對於需要外掛的豐富性網路應用服務（ Plug-in-Based Rich Internet Application ， RIA ），例如： AdobeFlash 、 Microsoft Silverlight 與 Oracle JavaFX 的需求，並且提供更多能有效加強網路應用的標準集。 HTML5 是 HTML 最新版本， 2014 年 10 月由全球資訊網聯盟（ W3C ）完成標準制定。目標是替換 1999 年所制定的 HTML 4.01 和 XHTML 1.0 標準，以期能在網際網路應用迅速發展的時候，使網路標準達到匹配當代的網路需求。
為什麼：
HTML4陳舊不能滿足日益發展的網際網路需要，特別是移動網際網路。為了增強瀏覽器功能 Flash 被廣泛使用，但安全與穩定堪憂，不適合在移動端使用（耗電、觸控、不開放）。
HTML5增強了瀏覽器的原生功能，符合 HTML5 規範的瀏覽器功能將更加強大，減少了 Web 應用對外掛的依賴，讓使用者體驗更好，讓開發更加方便，另外 W3C 從推出 HTML4.0 到 5.0 之間共經歷了 17 年， HTML 的變化很小，這並不符合一個好產品的演進規則。
對WEB標準以及W3C的理解與認識?
標籤閉合、標籤小寫、不亂巢狀、提高搜尋機器人搜尋機率、使用外 鏈css和 js 指令碼、結構行為表現的分離、檔案下載與頁面速度更快、內容能被更多的使用者所訪問、內容能被更廣泛的裝置所訪問、更少的程式碼和元件，容易維護、改版方便，不需要變動頁面內容、提供列印版本而不需要複製內容、提高網站易用性。
HTML5行內元素有哪些,塊級元素有哪些, 空元素有哪些?
(1)行內元素
a - 錨點
* abbr - 縮寫
* acronym - 首字
* b - 粗體 ( 不推薦 )
* bdo - bidi override
* big - 大字型
* br - 換行
* cite - 引用
* code - 計算機程式碼 ( 在引用原始碼的時候需要 )
* dfn - 定義欄位
* em - 強調
* font - 字型設定 ( 不推薦 )
* i - 斜體
* img - 圖片
* input - 輸入框
* kbd - 定義鍵盤文字
* label - 表格標籤
* q - 短引用
* s - 中劃線 ( 不推薦 )
* samp - 定義範例計算機程式碼
* select - 專案選擇
* small - 小字型文字
* span - 常用內聯容器，定義文字內區塊
* strike - 中劃線
* strong - 粗體強調
* sub - 下標
* sup - 上標
* textarea - 多行文字輸入框
* tt - 電傳文字
* u - 下劃線
* var - 定義變數
(2)塊元素 (block element)
* address - 地址
* blockquote - 塊引用
* center - 舉中對齊塊
* dir - 目錄列表
* div - 常用塊級容易，也是 css layout 的主要標籤
* dl - 定義列表
* fieldset - form控制組
* form - 互動表單
* h3 - 大標題
* h4 - 副標題
* h3 - 3級標題
* h4 - 4級標題
* h5 - 5級標題
* h6 - 6級標題
* hr - 水平分隔線
* isindex - input prompt
* menu - 選單列表
* noframes - frames可選內容，（對於不支援 frame 的瀏覽器顯示此區塊內容
* noscript - ）可選指令碼內容（對於不支援 script 的瀏覽器顯示此內容）
* ol - 排序表單
* p - 段落
* pre - 格式化文字
* table - 表格
* ul - 非排序列表
可變元素
可變元素為根據上下文語境決定該元素為塊元素或者內聯元素。
* applet - java applet
* button - 按鈕
* del - 刪除文字
* iframe - inline frame
* ins - 插入的文字
* map - 圖片區塊 (map)
* object - object物件
* script - 客戶端指令碼
(3)空元素 ( 在 HTML[1] 元素中，沒有內容的 HTML 元素被稱為空元素 )
<br/> //換行
<hr> //分隔線
<input> //文字框等
<img> //圖片
<link> <meta>
什麼是WebGL,它有什麼優點?
WebGL（全寫 Web Graphics Library ）是一種 3D 繪圖標準，這種繪圖技術標準允許把 JavaScript 和 OpenGL ES 2.0 結合在一起，通過增加 OpenGL ES 2.0 的一個 JavaScript 繫結， WebGL 可以為 HTML5 Canvas 提供硬體 3D 加速渲染，這樣 Web 開發人員就可以藉助系統顯示卡來在瀏覽器裡更流暢地展示 3D 場景和模型了，還能建立複雜的導航和資料視覺化。顯然， WebGL 技術標準免去了開發網頁專用渲染外掛的麻煩，可被用於建立具有複雜 3D 結構的網站頁面，甚至可以用來設計 3D 網頁遊戲等等。
WebGL完美地解決了現有的 Web 互動式三維動畫的兩個問題：
第一，它通過HTML指令碼本身實現 Web 互動式三維動畫的製作，無需任何瀏覽器外掛支援 ;
第二，它利用底層的圖形硬體加速功能進行的圖形渲染，是通過統一的、標準的、跨平臺的OpenGL介面實現的。
通俗說WebGL中 canvas 繪圖中的 3D 版本。因為原生的 WebGL 很複雜，我們經常會使用一些三方的庫，如 three.js 等，這些庫多數用於 HTML5 遊戲開發。