html學習筆記,html筆記
整理自某學習視屏(具體也忘了,或許是兄弟連,或許是其他人的)
<!-- 文法一“元素:一個整體,是一個對象 <標記名><、標記名>成對的標籤,也稱為容器標記中可以嵌套其他的標籤<br/> <hr />獨立標籤如: <a href="http://www.baidu.com">example</a>html用標記來描述元素,而html文檔就是由元素和標記組成的檔案文法二標籤屬性: 1,<tag>content<tag> 2,<tag><tag2>content<tag2><tag> 3,<tag /> 4,<tag pro="value" pro="value" ...> content </tag> 屬性在標記中使用,屬性值可以使用單引號,雙引號,不加引號 例:<font color="red" size="7"> 屬性是標記功能的擴充或行為的修飾,每一個屬性幾乎都是可選的文法三HTML標記不區分大小 如:<div><Div><DIV>都是有效<div>標籤HTML的注釋:開頭"<!--" 結尾"-->" 中間的既是注釋注釋中不能再包含注釋注釋不能在標記中使用文法四 html的代碼格式 任何斷行符號或空格在原始碼中都不起作用 所以要使用斷行符號或空格進行代碼排版文法五 html字元實體 一些字元在html中擁有特殊含義, 實體插入分三部分 1:以&開頭 2,以一個實體名或使用#和一個實體的編碼 3,以分號;結束 例如:< 是< > 是> 空格是 & 是amp; " 是" ' 是' 著作權符號是© 註冊商標是® *是× / 是÷文法六 HTML中顏色的設定 設定顏色可以是一個關鍵字或RGB的數字格式 以#開頭的數字格式:如#FF(0-255)從而RGB的表示是#FFFFFFhtml的主體結構 三部分:<html> 是網頁檔案的最外層標記 <head> 之間的文本是頭資訊,頭資訊不會在瀏覽器視窗中顯示 包括網頁的基本描述,整個網頁公用的屬性 可以放得標籤包括 <title>只能有一個 顯示在瀏覽器的標題列中 一般為公司名稱+公司產品 搜尋引擎收錄網頁時有用,是在搜尋引擎中的標題 <base>只能有一個 用於設定瀏覽器中檔案等的據對路徑 網頁中的檔案只需要寫下檔案的相對路徑即可 那這個路徑就是base中指定下的路徑 一般很少是使用 <link>可以有多個 設定外部檔案的串連標記 用於確定本頁面和其他的文檔的關係 外部樣式表的 <meta name="" content="">可以有多個 用於在網頁中加入一些描述資訊,如網頁的關鍵字,有利於搜尋引擎尋找分類 name不是自己定義的值,是固定的值,如 keywords:網頁的關鍵字,讓搜尋引擎收錄 description:網頁的描述,讓搜尋引擎顯示 robots:index(是否允許網頁被放到搜尋引擎資料庫中) noindex follow(允許通過此連結訪問其他人的房爺) nofollow all(前兩者) none 預設是all author:作者(不常用) copyright:版本(不常用) <meta http_equiv="" content="">(兩種形式) 用於在HTML文檔中類比HTTP協議的的相應訊息頭,例如,告訴瀏覽器是否快取頁面面 content-type :字元編碼方式 refresh:用於重新整理頁面,如果content帶上參數(time),即time秒後重新整理,如果content="3:http://www.baidu.com" 那麼三秒後就會轉到百度網站, expires:過去時間,content="時間值",緩衝到什麼時間,設定為0,則意味著禁止使用緩衝 windows-target 分針技術 pragma page-enter頁面進入的時候,可以設定一種特效,23種特效 content="revealtrans(transition=5,ouration=1.000)" page-exit頁面出來的時候,可以設定一種特性 <script> </head> <body> 是網頁的主體部分,即本文,包括文字,圖片,串連,視頻,表單 </body> </html>html檔案的結束點文法七 DTD 文件類型定義 xml文檔必須的html常用標籤: 格式標籤:用於定義把網頁中的文本的布局,縮排,位置,換行,列表等(所有的格式都可以由css完成) <br> 換行 <p> 段落 <center>內容置中,基於上一層標籤置中,不一定是基於網頁置中 <pre>保留文子在原始碼中的格式,即原型輸出 <ul>無序的列表,配合<li> <li>清單項目 <ol><li> 有序的列表,有序就是前面有1,2,3等等 <hr> 水平分割線 文字格式設定: <h1> ... <h6> <b> 粗體 <i> 斜體 <u>底線 三者可以結合使用 <font face="字型" color="" size=""> <tt>印表機字型</tt> <cite>引用,例證字型</cite> <em>強調的斜體字</em> <strong>強調的粗體字</strong> <small>小型字型</small> <big>輸出大型的字型</big>超連結標籤 URL="協議 主機 連接埠 檔案 附加資源" 比如:http://www.lamp.com:80/web/index.php?username=zhangsan&age=12&sex=male 對圖片 文本 聲音 影視的引用 相對URL 相對目前的目錄(訪問同一個網站) 比如:image/logo.gif ../css/demo.css 絕對URL 訪問外部的網站 <a href="URL" target=""></a> target:_self _blank 開啟一個新頁面錨點超連結 錨點:定義文章內容間的串連 <a name="maodianname">內容</a> :名字可以自己選取 使用:<a href="#maodianname">內容</a> 這裡的#表示當前頁面, <a href="#">內容</a> 表示返回此頁的首行 <a href="maito:example@example.com?subject=lamp?hello?chaongsonggei@qq.com">給我留言</a> 上面的語句會啟動原生發送用戶端映像標籤: 超連結是網站的靈魂 <img> src:圖片的URL border: alt:第一個作為一個tooltip作用;第二個當圖片不能顯示時,可以顯示一個圖片提示;可以搜尋引擎可以通過它指定的文字搜尋該圖片 width: height: 註:當圖片做成當串連後,會預設在圖片上加上一個邊框,此時可以設定border的屬性值為0,去除邊框 等比例縮放,只要任意給出width 或height映像地圖: 一個映像只能作為一個a標籤,做一個超連結 如果把一個映像分成多個地區,每一個地區作為一個串連,每一個串連成為一個熱點 首先將一個圖片設定為一個串連,然後指定一個usemap參數為mapname 定義一個map <map name="mapname"> <area shape="" coords="" href=""> shape指定形狀rect,poly,circle coords指定大小,rect用對角線確定,poly用頂點決定,circle用圓心和半徑確定 href指定串連 </map> 弊端: 1,載入慢 2,搜尋引擎找不到HTML的表格標籤 傳統的使用表格進行頁面排版 <table></table> 屬性:align 基於上一層標籤的位置left center right border 指定邊線 width height cellspacing:表格儲存格間的寬度 cellpadding:表格儲存格內容與儲存格邊緣的寬度 定義標題: caption: 屬性:align valign 放在<tr>之前 <caption>放在table之內 這樣標題和table就會成為一體,一起移動,如果是以<center>標題</center>製作的,標題和表格不是一體 定義列名; <th></th> 專門用來定義欄位名,和<td>用法一致,但是<th>文字是粗體和置中顯示 行:<tr></tr> 列:<td><td> align valign bgcolor colspan:作用跨列 rowspan:作用跨行 伺服器的輸出可以使用table<form> action method post 有資料限制 target title 起提示作用 enctype 指示瀏覽器使用哪種編碼方法將表單提交給www伺服器 兩種取值:application/x-www-form-urlencoded(預設) multipart/form-data 文本域 text: 指定屬性為readonly password 按鈕 submit button reset image 圖片按鈕 上傳檔案: file 下拉式清單 select option 清單項目 可以類比列表,多選列表,可以代替複選框 多行文本區 textarea cols rows wrap lable 定義快速鍵 <label for id accesskey=""> 每一個標籤都可以指定一個id(字串)HTML視窗分幀 把一個瀏覽器文件視窗分隔成多個視窗,每一個視窗都可以顯示一個獨立的網頁頁面,每一個幀都自己的url 通常用在背景首頁 分幀不利於瀏覽器 <frameset>標籤 屬性:rows,cols,可以使用固定值,也可以使用百分比和*三種 border 邊線寬度 frameborder 告訴標籤是否顯示邊框,取值0和1 <frameboder>標籤可以嵌套,嵌套之後,外圍的frameborder將會影響內部的frameborder,而修改內部的frameborder不會影響外圍的frameborder 注意:分幀不能和body體(即使只有一個文本字元)共存 <a href="" target=""> _blank _self _top _parent <frame>標籤 屬性:src:指定本表單只用的頁面 name: 用於在各個表單之間轉換時的一個標記,用在target屬性中 scrolling:取值為yes 或no,可以實現隱藏一部分東西 noresize:是否可以調動尺寸 <noframes> <iframe> 跟<frame>的用法一樣,實現畫中畫的效果,與 body共存 一般用在瀏覽器端,而frameset是用在後台-->