看過**的朋友,人的元神分為七魂六魄,常常忽略的也就是乙個人的魂,html之魂正是聚集元資料的head元素。形容的比較誇張,接下具體講解下head元素。
head元素通常包含三位一體既(網頁基本資訊,其它外鏈資訊,廠商定製)。
先來看看乙個基本html格式
網頁的基本資訊,其資訊包含了這個頁面所需要告訴****或者搜尋引擎爬取程式這個頁面是什麼,大致含有什麼內容。
舉個栗子
head裡面可以包含如下元素: meta元素 , title 元素 , link元素 , script元素
頁面基本資訊 主要有 title 和 meta
tite元素 :你好在這裡填寫整個文件的核心標題 < /title>
meta元素:
編碼格式 --- 表示這個頁面應該用什麼形式轉碼,通常建議用utf-8
搜尋引擎相關 ---
ie版本相關渲染 --- 這裡告訴如果是ie瀏覽器訪問,會建議用最新的edge來開啟網頁 ,避免ie瀏覽器的各種相容問題
視窗設定 --- viewport 適口 視窗設定 寬度等同於裝置寬度 縮放大小比例為1
其它外鏈資訊
link元素和script元素: 我們把html看成乙個房子,如果單純的是html檔案的話也只能稱為乙個房子的框架,而沒有js和css等其它檔案引入,頂多算是乙個清水毛胚罷了。那麼要拎包入住還需要搬入家具和電器,好好裝修(渲染)下才行。
(**的家具和家電,**的互動,全靠js來負責)
--- 定義風格 (好比定義**由什麼色彩風格地板磚和牆壁)
廠商定製
現在越來越多的瀏覽器稱為雙核,當然這個不是cpu的雙核,而是擁有兩種不同渲染機制規則而已。打個比方我們開啟「搜狗瀏覽器」 「360瀏覽器」 「qq瀏覽器」 「獵豹瀏覽器」等 國內比較優秀的瀏覽器開啟網頁會有 極速模式,相容模式 等等。其也是代表用什麼機制來渲染頁面而已,為了就是滿足不同使用者的體驗。
<meta
name
="renderer"
content
="webkit"
> 預設webkit模式
<
meta
name
="renderer"
content
="ie-stand"
> 預設為ie標準模式
<
meta
name
="renderer"
content
="ie-comp"
> 預設為ie相容模式
說說關於不同核心私有屬性:
核心不是那麼神秘,說說主流的各家瀏覽器用的什麼瀏覽器核心(網頁渲染引擎)。而我們經常在**會看到各種不同的瀏覽器私有屬性寫法,這也是考慮相容的問題
background: -moz-linear-gradient( top,#ccc,#000);
-moz- 代表firefox瀏覽器私有屬性
-ms- 代表ie瀏覽器私有屬性
-webkit- 代表chrome、safari私有屬性
-o- 代表opera私有屬性
pritce:
1、 head元素裡主要包含了哪三塊內容?
2、外鏈元素是放在哪個標籤裡的?
3、廠商定製的大概有哪一些模式?
4、能否簡單說下視窗設定代表什麼意義?
HTML入門之head標籤學習
主要是配置 瀏覽器顯示資料的配置資訊 eg 字串編碼 一般是給瀏覽器進行使用 網頁標題標籤 告訴瀏覽器使用什麼標題顯示網頁 標題名編碼格式標籤 告訴瀏覽器使用指定的編碼格式解析文件 編碼格式 text html charset 編碼格式 html4 網頁搜尋優化標籤 提公升網頁在瀏覽器中的搜尋速度 ...
html網頁中head之meta標籤
什麼是meta標籤?在乙個網頁中meta標籤常常被用做網頁關鍵字 網頁介紹 作者 網頁編碼 robots 自動跳轉等宣告及說明標籤。網頁顯示字符集網頁編碼 簡體中文 中文 正體中文 英 語 2 網頁製作者資訊 3 網頁關鍵字宣告 搜尋引擎優化地方 4 網頁簡介說明 搜尋引擎優化地方 5 防止別人在框...
Html介紹,認識head標籤
標籤位於html文件的頭部,主要是用來描述文件的各種屬性和資訊,包括文件的標題等,當然文件頭部包含的資料都不會真正作為內容展示給訪客的。如下的一些標籤常用於標籤部分 標籤 在和之間的的文字內容是網頁的標題資訊,它會出現在瀏覽器的標題欄目中。網頁的標籤用於告訴使用者和搜尋引擎這個網頁的主要內容是什麼,...