摘要：元數(shù)據(jù)是關于數(shù)據(jù)的信息。標簽提供關于文檔的元數(shù)據(jù)。元數(shù)據(jù)不會顯示在頁面上，但是對于機器是可讀的。典型的情況是，元素被用于規(guī)定頁面的描述關鍵詞文檔的作者最后修改時間以及其他元數(shù)據(jù)。

                   Web前端的基礎知識

什么是web？
WEB標準是一系列標準的總稱，包括HTML4.0、XHTML1.1、CSS2.1、XML1.0、RSS2.0、ECMAScript1.1、DOM1.0等等。WEB標準不僅僅是大家常說的DIV+CSS。

一、HTML部分
合理的結構
Html4.0的時候我們基本都是用table來布局，但是web2.0時代也是如大家所知道的那樣用div+css來布局，table布局幾乎不必用到css來影響web的表現(xiàn)，但是卻要一層套一層的table，td，tabel…，如此頁面相當難以維護，且不易控制表現(xiàn)；而使用div+css來布局就顯得更加合理，它使得html結構層與css表現(xiàn)層分離，便于維護，但是它也帶來可怕的兼容性問題，特別是ie系列瀏覽器，它有自己的一套解析和渲染頁面的方式與w3c標準實現(xiàn)有著一系列的差異，不過這些差異可以通過hack來解決，而且一旦你掌握了合理的結構，兼容的css，標準的寫法這些差異其實完全可以避免產(chǎn)生。html標簽通常由尖括號包圍的關鍵詞，其標簽通常是成對出現(xiàn)的 和開始和結束標簽也被稱為開放標簽和閉合標簽。

元數(shù)據(jù)（metadata）是關于數(shù)據(jù)的信息。
標簽提供關于 HTML 文檔的元數(shù)據(jù)。元數(shù)據(jù)不會顯示在頁面上，但是對于機器是可讀的。
典型的情況是，meta 元素被用于規(guī)定頁面的描述、關鍵詞、文檔的作者、最后修改時間以及其他元數(shù)據(jù)。
標簽始終位于 head 元素中。
元數(shù)據(jù)可用于瀏覽器（如何顯示內(nèi)容或重新加載頁面），搜索引擎（關鍵詞），或其他 web 服務。

  //指明文字編碼
   //指明采用的語法
     //指明作者
   //指明版權 
    //對網(wǎng)站的簡單描述
      //說明了本網(wǎng)站的關鍵字。


 


對不起。我們已經(jīng)搬家了。您的 URL 是 http://www.baidu.com


您將在 5 秒內(nèi)被重定向到新的地址。

如果超過 5 秒后您仍然看到本消息，請點擊上面的鏈接。

后面2行主要是被百度這些搜索網(wǎng)站檢索的時候用到的，非常重要。

html鏈接： 標簽進行定義的。
例子： baidu href:在href屬性中指定連鏈接的地址，是超文本引用的意思。
style="text-decoration:none"創(chuàng)建一個沒有下劃線的超鏈接
定義沒有下劃線
html圖像： 圖像的名稱和尺寸是以屬性的形式提供的。
tppabs：該軟件是離線瀏覽器。

替換文本屬性（Alt）
alt 屬性用來為圖像定義一串預備的可替換的文本。替換文本屬性的值是用戶定義的。

設置圖像的對齊方式：

圖像 ,是關閉空元素的方法。使用空的段落標記

html（提示：使用小寫標簽）
屬性為html元素提供附加信息。 屬性總是以名稱/值對的形式出現(xiàn)。Name=value 屬性總是在html元素的開始標簽中規(guī)定。

設置在html中字體的格式。

擁有關于對齊 方式的附加信息，居中排列標題。

標簽在 HTML 頁面中創(chuàng)建水平線。

html注釋
可以將注釋插入 HTML 代碼中，這樣可以提高其可讀性，使代碼更易被人理解。瀏覽器會忽略注釋，也不會顯示它們。
注釋是這樣寫的：
實例
注釋列表

html拆行

        如果您希望在不產(chǎn)生一個新段落的情況下進行換行（新行），請使用 
 標簽：

This is
a para
graph with line breaks

瀏覽器忽略了源代碼中的排版（省略了多余的空格和換行）

始終為屬性值加引號。屬性值應該始終被包括在括號內(nèi)。雙引號是最常用的，若屬性值本身含有雙引號，則必須使用單引號。

1、標頭元素定義title，搜索引擎關鍵字
2、標題元素
3、段落元素

4、字形元素 定義一個粗體字形元素。
5、下劃線字體 :
6、定義斜體字體
7、鏈接元素定義一個錨元素，也就是鏈接元素
8、圖像元素 定義個圖像元素。
9、表格元素

定義表頭元素，需要加入rules=groups
定義表主體元素
定義表尾中的元素。

創(chuàng)建頁面表格：都以像素作為單位；width：設置表格的寬度。

10、列表元素：html中的列表：無序列表以及有序列表

:無序列表 若需要更改列表項的標志，type的屬性可是disc、square 、circle中的任意一個。

 
每一個列表

：有序列表

 每一個列表

11、表單元素：

 表單元素一般作為數(shù)據(jù)，提交給后臺服務器做處理。它是由
  
來定義的。

如果要在表單中包括一個或多個文件選擇字段，必須把

標簽的enctype屬性設置為multipart/form-data。

最常用的表單標簽 標簽的類型由標簽屬性type決定。


                    "password"  定義密碼輸入框。
                    "radio"用來定義單選按鈕。
                    "checkbox"定義個復選框。
                    "submit"定義個提交按鈕。

input：accpet屬性：可約束瀏覽器允許用戶選擇的文件類型。
的主要屬性：action以及method:
action:用來指定表單數(shù)據(jù)被提交后，處理這些數(shù)據(jù)的程序的地址
Method: 1 post:將表單數(shù)據(jù)放在http數(shù)據(jù)的正文部分進行傳遞。將與action中指定的表單處理服務器連接；瀏覽器按分段傳輸?shù)姆椒▽?shù)據(jù)傳給服務器。

      2 get:將表單數(shù)據(jù)加到action所指的地址之后進行傳遞。瀏覽器先與表單處理服務器建立鏈接，在一個步驟中發(fā)送所有的表單數(shù)據(jù)。

get：從服務器上獲取數(shù)據(jù)；
post：向服務器傳送數(shù)據(jù)。 其中get是form的默認方法。

標簽：定義一個select表單控制中的每個條目，瀏覽器將標簽中的內(nèi)容作為標簽的菜單或是滾動列表中的一個元素顯示，其內(nèi)容只能是純文本，不能有任何裝飾。



Volvo Saab Mercedes Audi




selected屬性：在option標簽中包含selected屬性后，就能預定一個或多個選項。

二、CSS部分
對于一條css如何定義，不用多講，但是在定義css的時候我們最好考慮一下是否有必要加上這個className，因為定義css我們完全可以使用標簽來定義，比如上面的例子里，我們想給span里的文字加粗或者換成紅色字體，沒有必要給這個span標簽特意加上一個className，可以直接這樣來定義
.topbar p span{font-weight:bold;color:red;}
這樣我們可以節(jié)約很多className名字，避免因為相同的樣式名而覆蓋了之前的屬性，而且層次結構也足夠的清晰。

行內(nèi)元素和塊級元素
塊級元素生成一個元素框，（默認地）它會填充其父級元素的內(nèi)容，旁邊不能有其他元素。換句話說，他在元素框之前和之后生成了“分隔”符。我們最熟悉的HTML元素就是是p和div.
行內(nèi)元素在一個文本行內(nèi)生成元素框，而不會打斷這行文本。行內(nèi)元素最好的例子就是XHTML中的a,span元素。strong和em也屬于行內(nèi)元素。這些元素不會在它本身之前或之后生成“分隔符”，所以可以出現(xiàn)在另一個元素的內(nèi)容中，而不會破壞其顯示。
注意，盡管“塊”和“行內(nèi)”這兩個詞與HTML和XHTML中的塊級和行內(nèi)元素有很多共同點，但也存在一個重要的差別。在HTML和XHTML中，塊級元素不能繼承自行內(nèi)元素（即不能嵌套在行內(nèi)元素中）。但是CSS中，對于顯示內(nèi)容如何嵌套不存在任何限制。

1、內(nèi)部樣式表 內(nèi)部樣式表只對所在的網(wǎng)頁有效。

   當單個文件需要特別樣式時，就可以使用內(nèi)部樣式表。你可以在 head 部分通過 

2、外部樣式表：將樣式寫在一個以.css為后綴的css文件里面。

  當樣式需要被應用到很多頁面的時候。外部樣式將是理想的選擇，使用外部樣式表，可以通過更改一個文件來改變整個站點的外觀。

rel 屬性規(guī)定當前文檔與被鏈接文檔之間的關系
你的例子里rel 屬性指示被鏈接的文檔是一個樣式表只有 rel 屬性的 "stylesheet" 值得到了所有瀏覽器的支持。其他值只得到了部分地支持。

3、內(nèi)嵌樣式

    當特殊的樣式需要應用到個別元素時，就可以使用內(nèi)聯(lián)樣式。使用內(nèi)聯(lián)樣式的方法是在相關的標簽中使用樣式屬性。樣式屬性可以包含任何 CSS 屬性。以下實例顯示出如何改變段落的顏色和左外邊距。
 ，用style定義內(nèi)嵌的。
This is a paragraph