初識HTML

HTML、XML、XHTML 有什么區別

  • HTML全名為超文本標記語言(Hyper Text Markup Language),是用于創建Web的標準的標記語言,語法松散,不嚴格,編碼不規范,表現、結構混亂。
  • XML是可擴展標識語言(The eXtensible Markup Language),比html更為嚴格,用途是定義結構、存儲信息、傳送信息。
  • XHTML是可擴展超文本標記語言(eXtensible HyperText Markup Language),是一種標記語言,基于XML,表現方式與超文本標記語言HTML類似,不過語法上更加嚴格。

怎樣理解 HTML 語義化

語義化是數據和表述的本體的映射成為可能,首先表達出結構,并且通過一些結構的直接聲明(約定俗成)讓計算機可以找到這些結構的本體,然后計算機就可以通過本體的關系來進行邏輯演繹。我們目前可用的技術里面應該充分的考慮到計算機非常弱的理解能力,盡量說一些約定俗成的東西,這樣機器人就可以幫我們進行一些我們人類不太擅長但是它很擅長的推理計算了。那么最好我們能夠讓我們的文檔在描述相關的本體的時候使用計算機更容易理解的結構,這就是語義化。也就是說用某一種模式來表達計算機可以理解的詞匯,這就是HTML的語義化。
通俗概括,語義化是為了讓計算機能夠很好的通過自描述的結構逐漸掌握我們人類的詞匯,理解我們人在說什么,這樣它就可以更好的為我們服務。

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

之前說到語義化是為了讓計算機更好地理解我們人所要表達的內容
,因此我們必須回歸內容本身,將內容本身的語義合理地表述出來,
再為不同的用戶代理設計不同的樣式描述,這就是內容與樣式分離。
內容與樣式分離
一方面 ,簡化從全面重新設計到輕微設計調整的任何更改,對其中一部分內容或樣式的更改使你無需改變其余整體。
另一方面,一篇文檔的實際內容和意義,與這篇文檔呈現給讀者的方式,是相互獨立的
這使得它很容易在同一內容應用不同的樣式,即為不同的用戶代理設計不同的樣式描述。

有哪些常見的meta標簽

1、指定字符集:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
2、向搜索引擎說明你的網頁的關鍵字:
<meta name="keywords" content="關鍵字"/>
3、告訴搜索引擎你的站點的主要內容:
<meta name="description" content=""/>
4、告訴搜索引擎你的站點的制作的作者:
<meta name="author" content=""/>
5、定時讓網頁在指定的時間n內跳轉
<meta http-equiv="refresh" content="n;url="/>
6、勇于設定網頁的到期時間,一旦過期則必須到服務器上重新調用,需要注意的是必須使用GMT時間格式:
<meta http-equiv="expires" content="Mon,12 May 2010 00:00:00 GMT"/>
7、禁用緩存:
<meta http-equiv="pragma" content="no-cache"/>
8、cookie設定,如果網頁過期,存盤的cookie將會被刪除,需要注意的是也必須使用GMT時間格式:
<meta http-equiv="set-cookie" content="Mon,12 May 2010 00:00:00 GMT" />
9.瀏覽器的內核控制
<meta name="renderer" content="webkit|ie-comp|ie-stand">

文檔聲明的作用?<!doctype html> 的作用?

<!DOCTYPE> 聲明處于 <html> 標簽之前。此標簽可告知瀏覽器文檔使用哪種 HTML 或 XHTML 規范。在制作網頁時都需要定義文檔的類型,即doctype。如果不聲明網頁的文檔類型,瀏覽器在解析的時候會以混雜模式解析網頁代碼,不同的瀏覽器下,混雜模式解析的網頁效果差別很大,會造成網頁布局排版的錯位,因此在寫html代碼前有必要寫明文檔類型。

嚴格模式和混雜模式指什么?

Doctype可聲明三種DTD類型,分別表示嚴格版本、過渡版本以及基于框架的 HTML 文檔。
當瀏覽器廠商開始創建與標準兼容的瀏覽器時,他們希望確保向后兼容性。為了實現這一點,他們創建了兩種呈現模式:嚴格模式和混雜模式
嚴格模式是瀏覽器根據web標準去解析頁面,是一種要求嚴格的DTD,不允許使用任何表現層的語法,在嚴格模式中,瀏覽器以其支持的最高標準呈現頁面,;

在混雜模式中,頁面以一種比較寬松的向后兼容的方式顯示。混雜模式通常模擬老式瀏覽器的行為以防止老站點無法工作。

模式觸發

觸發嚴格模式

觸發嚴格模式很簡單,就是正常的建立網頁,聲明正確的DTD,便是嚴格模式。
觸發混雜模式

而混雜模式的觸發可以通過在HTML文檔開始不聲明DTD,或者在DOCTYPE前加入XML聲明<?xml version=”1.0〃 encoding=”utf-8〃?>來實現

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

產生亂碼的原因一般是文檔沒有聲明自身的編碼導致瀏覽器錯誤地使用了與文檔不同的解碼方式,從而導致內容無法正常顯示
一定要清楚文件保存時的編碼方式并在文件內聲明

常見的瀏覽器有及其內核

瀏覽器 內核
IE瀏覽器(IE4以上) Trident內核(IE內核)
Mozilla Firefox Gecko
Google Chrome 前期webkit(蘋果),如今blink
Opera blink
Safari webkit
搜狗瀏覽器、傲游瀏覽器、QQ瀏覽器 兼容模式(IE:Trident)和高速模式(webkit)
360極速瀏覽器 基于谷歌(Chromium)和IE內核
360安全瀏覽器 IE內核
Netscape Gecko

常見的標簽及其應用場景

標簽 場景
<html>...</html> 將所有HTML內容都包含在這個標簽內
<head>...</head> 用于定義文檔的頭部,它是所有頭部元素的容器。
<title>...</title> 文檔的標題
<meta>...</meta> 提供有關頁面的元信息
注釋
bgcolor 頁面背景色
text 文字顏色(規定所有文本顏色)
topmargin 上頁邊距
leftmargin 左頁邊距
rightmargin 右頁邊距
bottomargin 下頁邊距
background 背景設置
<font color="" face="" size=""></font> 控制字體;color="顏色";face,字體;size,字體大小。
< b > < /b > 字體加粗
< i >< /i > 傾斜
< u>< /u > 下劃線
< strong >< /strong > 字體加粗(強調,語氣加強用)
< em >< /em > 字體傾斜(強調,語氣加強用)
<center></center> 居中。
< u >< /u > 下劃線
h1~h6 標題(會自動換行)。HTML標題(Heading)是通過h1~h6 等標簽進行定義的。重要性依次遞減
< p > < /p > 段落標簽(段落之間空行)
<div></div> 層標簽(默認占一行)
< span > < /span > 層標簽(默認用多大空間占多大空間)
< ol type="1 " > < li> < /li> < /ol> --有序列表,序號為1,2,3……,引號中可以更改序號形式,ol改為ul則為無序列表,不具備自動換行
<a href="超鏈接地址" target=“_blank”>超鏈接的文字</a> 超鏈接標簽,href(hyperlink reference);_blank是在新窗口打開
< i m g src="圖片地址" alt="文字" width="" height="" / > 圖片鏈接標簽,高跟寬設置一個即可,顯示圖片會按比例縮放。alt在圖片無法加載時,顯示文字,還可幫助搜索引擎搜索。< img / >必須單獨出現。
<table></table> 表格
width 寬度,可以用像素或百分比表示。常用960像素。
border 邊框,常用值0。
cellpadding 內容跟單元格邊框的邊距。常用值0。
cellspacing 單元格之間的間距。常用值0。
<tr></tr>
<td></td> 單元格
<th></th> 表頭,單元格的內容自動居中、加粗
align :一行的內容的水平對齊方式
colspan="n" 合并同一行單元格(后面寫代碼要減去相對應的列)
rowspan="n" 合并同一列單元格(從第二行開始減去對應的列)
< a >...< /a > 定義錨,即在頁面插入鏈接
< q >...< /q > 定義短引用
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • HTML、XML、XHTML 有什么區別 1.HTML 是用來描述網頁的一種語言,指的是超文本標記語言 (Hype...
    饑人谷_牛牛閱讀 720評論 0 2
  • 一、HTML、XML、XHTML 有什么區別 HTML: 超級文本標記語言是標準通用標記語言下的一個應用,也是一種...
    淡然7698閱讀 265評論 0 1
  • 1.HTML、XML、XHTML 有什么區別 HTML: 超文本標記語言,是語法較為松散的、不嚴格的Web語言 對...
    饑人谷_米彌輪閱讀 460評論 0 1
  • HTML、XML、XHTML 有什么區別: 都是標記語言 HTML:超文本標記語言 語言較為松散,不嚴格的web語...
    崔太阿閱讀 207評論 0 1
  • 一、安裝hustoj 百度“hustoj github”可以看到源代碼和安裝教程。 Ububun 14.04很16...
    池中雨景閱讀 1,693評論 0 0