1. 程式人生 > >HTML、XML、XHTML 有什麽區別?

HTML、XML、XHTML 有什麽區別?

簡單介紹 粗體 創建 小寫字母 hyper intern spa htm 控件

  1. HTML即是超文本標記語言(Hyper Text Markup Language),是最早寫網頁的語言,但是由於時間早,規範不是很好,大小寫混寫且編碼不規範,是語法較為松散的、不嚴格的Web語言

  2. XHTML是升級版的html(Extensible Hyper Text Markup Language),對html進行了規範,編碼更加嚴謹純潔,也是一種過渡語言,html向xml過渡的語言。實際上XHTML 與 HTML 4.01 標準沒有太多的不同。

  3. XML是可擴展標記語言(Extensible Markup Language),是一種跨平臺語言,編碼更自由,可以自由創建標簽(

    比如像下面這樣創建:

    <note><to>Tove</to><from>Jani</from><heading>Reminder</heading><body>Don‘t forget me this weekend!</body></note>

    ),主要用於存儲數據和結構,可擴展

HTML和XML的區別:

  • XML 被設計用來傳輸和存儲數據,其焦點是數據的內容。
  • HTML 被設計用來顯示數據,其焦點是數據的外觀。
  • HTML 旨在顯示信息,而 XML 旨在傳輸信息。
  • XML在定義標記時區分大小寫,而HTML標記不區分大小寫。

HTML和XHTML的區別:

  • XHTML 元素必須被正確地嵌套。

    例如:XHTML必須要這樣<b><i>This text is bold and italic</i></b>
    而在 HTML 中,某些元素可以像這樣彼此不正確地嵌套:
    <b><i>This text is bold and italic</b></i>

  • XHTML 元素必須被關閉。

    例如<p>This is a paragraph</p>

    ===>>這是正確的
    <p>This is a paragraph===>>這是錯誤的

  • 標簽名必須用小寫字母。

    例如: <p>This is a paragraph</p>==>>這是正確的
    <P>This is a paragraph</P>===>>這是錯誤的

  • XHTML 文檔必須擁有根元素。

    所有的 XHTML 元素必須被嵌套於 <html> 根元素中


  • 怎樣理解 HTML 語義化?

HTML語義化是讓大家直觀的認識標簽(markup)和屬性(attribute)的用途和作用,選擇合適的標簽(代碼語義化)便於開發者閱讀和寫出更優雅的代碼的同時讓瀏覽器的爬蟲和機器很好地解析,並且便於團隊開發和維護。


  • 怎樣理解內容與樣式分離的原則?

寫 HTML 的時候先不管樣式, 重點放在HTML的結構和語義化上,讓 HTML 能體現頁面結構或者內容。之後再去寫樣式。
寫 JS 的時候,盡量不要用 JS 去直接操作樣式,而是通過給元素添加刪除class來控制樣式變化。
文檔結構與文檔樣式的分離可以確保網頁的平穩退化,也讓內容和樣式在可以分開獨立編輯。


  • 有哪些常見的meta標簽?

  • 指定字符集
    <meta charset="utf-8">

  • 向搜索引擎說明你的網頁的關鍵詞
    <meta name="keywords" content="">

  • 告訴搜索引擎你的站點的主要內容
    <meta name="description" content="">

  • 告訴搜索引擎你的站點的制作的作者
    <meta name="author" content="your name">

  • 響應式頁面
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

  • 定時讓網頁在3秒內跳轉到mozilla首頁(http-equiv 屬性為名稱/值對提供了名稱。並指示服務器在發送實際的文檔之前先在要傳送給瀏覽器的 MIME 文檔頭部包含名稱/值對。)
    <meta http-equiv="refresh" content="3" url=https://www.mozilla.org">

  • 如果安裝了GCF (Google Chrome Frame),則使用GCF來渲染頁面 ("chrome=1"), 如果沒有安裝GCF,則使用最高版本的IE內核進行渲染 ("IE=edge")。X-UA-Compatible(瀏覽器采取何種版本渲染當前頁面)
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  • 瀏覽器的內核控制
    <meta name="renderer" content="webkit|ie-comp|ie-stand">


  • 文檔聲明的作用?

文檔聲明用來告知瀏覽器當前文檔所使用的類型,讓瀏覽器解析器知道要用什麽規範來解析文檔。


  • 嚴格模式和混雜模式指什麽?

在嚴格模式中,瀏覽器以其支持的最高標準呈現頁面。
在混雜模式中,又稱怪異模式或兼容模式,瀏覽器用自己的方式解析代碼,頁面以一種比較寬松的向後兼容的方式顯示。混雜模式通常模擬老式瀏覽器的行為以防止老站點無法工作。


  • <!doctype html> 的作用?

它是html5標準網頁聲明,告訴瀏覽器用最新的 HTML5標準來解析渲染頁面;如果不寫,瀏覽器就會進入混雜模式。


  • 瀏覽器亂碼的原因是什麽?如何解決?

亂碼產生的根本原因是保存的編碼格式和瀏覽器解析時的解碼格式不匹配導致的。
解決方式: 寫代碼的時候在html 的 <head>裏添加<meta charset=‘xxx‘>並且保存的時候仍選擇同樣的編碼方式。


  • 常見的瀏覽器有哪些?什麽內核?

  • Internet explorer 使用的是Trident

  • Firefox使用的是Gecko。

  • opera之前使用的是Presto,後來用Blink

  • 蘋果的Safari,谷歌的Chrome使用的是WebKit,還有國產的大部分雙核瀏覽器其中一核就是WebKit。


  • 列出常見的標簽,並簡單介紹這些標簽用在什麽場景?

標簽運用場景
<html> HTML 頁面的根元素
<body> 文檔的內容
<head> 用於定義文檔的頭部
<meta> 提供了元數據.元數據也不顯示在頁面上,被瀏覽器解析
<title> 文檔的標題
<h1>-<h6> 定義了一級標題到六級標題,標題字體大小逐漸減弱
<p> 定義一個段落
<a> 網頁鏈接
<div> 塊級元素,它可用於組合其他 HTML 元素的容器,沒有特定的含義
<span> 內聯元素,也沒有特定的含義,可用作文本的容器
<u> 下劃線
<em> 強調文本
<strong> 加重文本
<ol> 有序列表
<ul> 無序列表
<li> 定義列表項目
<img> 圖片
<br > 換行
<input> 定義輸入控件
<i> 斜體字
<table> 定義表
<tr> 定義表格中的行
<td> 定義表中的單元格
<th> 定義表格的表頭
<tbody> 定義表格的主體
<tfoot> 定義表格的頁腳
<hr> 創建一條水平線
<iframe> 定義內聯框架
<cite> 定義作品的標題
<button> 按鈕
<b> 定義粗體文本
<form> 定義用於用戶輸入的HTML表單
<caption> 定義表標題
<footer> 定義文檔或節的頁腳

HTML、XML、XHTML 有什麽區別?