HTML & CSS

1 請遵循html元素必須有開始和結束的標準規範
<html></html>
<p></p>

2 空元素,空元素沒有結束標籤,形式以下
<br />   //換行
<hr />   //水平線

3 html註釋
<!--  註釋內容 -->

4 上標下標
<sub>下標</sub>    //下標
<sup>上標</sup>    //上標

5 預格式文本
<pre></pre>   //保留了裏面的空格,適合放代碼,html元素默認會除去行首行尾段首段爲空格

6 刪除線下劃線
<del></del>
<ins></ins>

7 連接
沒有下劃線的連接
<a href="/example/html/lastpage.html" style="text-decoration:none">

使用 Target 屬性,你能夠定義被連接的文檔在何處顯示
<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

連接到同一個頁面的不一樣位置
name 屬性規定錨(anchor)的名稱。您可使用 name 屬性建立 HTML 頁面中的書籤。書籤不會以任何特殊方式顯示,它對讀者是不可見的
<a name="tips">基本的注意事項 - 有用的提示</a>
<a href="#tips">有用的提示</a>

8 樣式表
  內部定義的
<head>
<style type="text/css">
h1 {color: red}
p {color: blue}
</style>
</head>
 
  引用外部的
<head>
<link rel="stylesheet" type="text/css" href="/html/csstest1.css" >
</head>

  內聯樣式
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>

9 規定字體的大小顏色
<font size="3" color="red">This is some text!</font>
<font size="2" color="blue">This is some text!</font>
<font face="verdana" color="green">This is some text!</font>    

10 圖像標籤
<img>    定義圖像。
<map>    定義圖像地圖。
<area>    定義圖像地圖中的可點擊區域。

10 div,span 塊級元素

11 表單和輸入元素
<form></form>
<input></input>
<input type="checkbox" name="bike">

11 框架
   垂直框架

<frameset cols="25%,50%,25%">

  <frame src="/example/html/frame_a.html">
  <frame src="/example/html/frame_b.html">
  <frame src="/example/html/frame_c.html">

</frameset>

水平框架
<frameset rows="25%,50%,25%" noresize="noresize">

  <frame src="/example/html/frame_a.html">
  <frame src="/example/html/frame_b.html">
  <frame src="/example/html/frame_c.html">

</frameset>

內聯框架
<iframe src="http://www.baidu.com" width="200" height="200"></iframe>

12 文檔描述
<meta name="author"
content="w3school.com.cn">

<meta name="revised"
content="David Yang,8/1/07">

<meta name="keywords"
content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">

<meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" />   //重定向

13 須要知道的一些元素
<head><meta><base><link><style><script>

14 html註釋
<!--      -->


15 css定義的語法
三部分組成:一個選擇器,屬性和一個值
選擇器是你但願去定義的html元素/標籤
值爲多個單詞必須用雙引號括起來,多個屬性用分號隔開
--  selector{property:value}
例如
-  body{color:black}
-  p{font-family:"sans serif";text-align:center;color:red}

也能夠分行寫,更具可讀性
例如:
   p{
    font-family:"sans serif";
    text-align:center;
    color:red
    }
    
也能夠將選擇器組合
例如一下3種標題使用一種樣式
 h1,h2,h3{color:red}

 選擇器類,將同一類型的html元素定義出不一樣類型的樣式
 例如:
 p.right{text-align:right;color:red}
 p.left{text-align:left;color:red}
 使用方式以下:
 <p class="left">類屬性</p>
 
 省去標籤名稱直接去定義,這樣就能夠在全部的html元素中使用了,  '.'點號不能省
 例如:
 .center{text-align:center}
 <p class="center">類屬性</p>          //全部使用了center類的元素均可以使用
 
 id選擇器,爲不一樣的html元素定義相同的樣式
 例如:
 #green{color:green}
 <h1 id="green">搜呢麼</h1>
 <p id="green">搜呢麼</p>
 
 css註釋
 例如:
 /*  這是註釋 */
 
 外部樣式表
 使用<link>標籤讓每一個頁面都鏈接到樣式表,<link>標籤在head區域使用
 例如:
 <head>
        <title>這是網頁的標題</title>
        <link rel="stylesheet" type="text/css" href="my.css" >        //可使用相對路徑或者絕對路徑
</head>

內部樣式表在head區域使用<style type="text/css">定義
例如:
<style type="text/css">
.center{color:red}
</style>

行內樣式
例如:
<p style="color:red;margin-left=20px">行內樣式</p>

多重樣式表
樣式表優先級:行內樣式,內部樣式,外部樣式,瀏覽器樣式
當給同一標籤訂義了樣式表時,按照優先順序選取樣式表中定義的值,
即定義了相同值取優先級高的,沒有定義取優先級低的已經定義了的


16 http協議
1)請求行格式以下
Method Request-URI HTTP-Version CRLF
例如:
GET /test.html HTTP/1.1 (CRLF)

GET請求獲取由Request-URI所標識的資源。
POST在Request-URI所標識的資源後附加新的數據
HEAD獲取由Request-URI所標識的資源的響應消息,要求服務器接收附在請求後面的數據

當咱們經過瀏覽器的地址欄直接輸入網址的方法訪問網頁時瀏覽器採用的就是get方法
協議中GET和POST必須大寫,html中不區分大小寫

2)http響應
三部分組成:狀態行,消息報頭,響應正文
格式以下:
HTTP-Version Status-Code Reason-Phrase CRLF

狀態碼類別
1XX 指示信息,表示已經接收,繼續處理
2XX 成功,表示請求已經被成功接收,理解,接受
3XX 重定向,要完成請求必須進行更進一步的操做
4XX 客戶端錯誤,請求有語法錯誤或沒法實現
5XX 服務器錯誤,服務器未能是實現合法請求

常見的狀態碼
200 客戶端請求成功
400 因爲客戶端請求有語法錯誤,不能被服務器所理解
401 請求未經受權
403 服務器收到請求可是拒絕提供服務
404 請求的資源不存在,好比輸入了錯誤的url
500 服務器發生不可預期錯誤,致使沒法完成客戶的請求
503 服務器當前不可以處理客戶端的請求,在一段時間後服務器可能恢復正常

對於請求消息,開始行就是請求行,對於響應消息,開始行就是狀態行

GET /index.html HTTP/1.1
Host:www.sina.com.cn
 css

相關文章
相關標籤/搜索