WEB前端培訓:HTML常用標簽及其屬性

日期:2020-12-04 10:29作者:北大青鳥西安建大IT學院

摘要:基本 html/html 定義 HTML 文檔 head/head 文檔的信息 meta HTML 文檔的元信息 title/title 文檔的標題 link 文檔與外部資源的關系 style/style 文檔的樣式信息 body/body 可見的頁面內容 !---- 注釋 meta標記
關鍵詞: 北大青鳥web前端
  基本
 
  <html>…</html>      定義 HTML 文檔
 
  <head>…</head>   文檔的信息
 
  <meta>                    HTML 文檔的元信息
 
  <title>…</title>        文檔的標題
 
  <link>                      文檔與外部資源的關系
 
  <style>…</style>    文檔的樣式信息
 
  <body>…</body>   可見的頁面內容
 
  <!--…-->                 注釋
 
  <meta>標記
 
  <meta>的主要作用,是提供網頁的元信息。比如:指定網頁的搜索關鍵字。
 
  <meta>標記有兩個屬性:http-equid和name。
 
  1.http-equiv屬性
 
  功能:模擬http協議文件頭信息,當信息從服務器端傳到客戶端時,告訴瀏覽器如何正確的顯示網頁內容。
 
  http-equiv屬性一般要與content屬性配合使用。Content屬性指定信息的詳細參數。
 
 ?。?)設置網頁的字符集
 
  <meta http-equiv=“Content-Type” content=“text/html;
 
  charset=utf-8” />
 
 ?。?)網頁自動刷新
 
  <meta http-equiv=“refresh” content=“2”>   //每隔2秒鐘,自動刷新網頁一次
 
  <meta http-equiv=“refresh” content=“2;url=http://www.ifeng.com”>   //2秒鐘后,跳轉到鳳凰網
 
  2.name屬性
 
  name屬性主要用于設置網頁的搜索關鍵字、版權信息、作者等。
 
 ?。?)設置網頁搜索關鍵字
 
  <meta name=“keywords” content=“網站建設,企業網站建設,網站制作,網上商城,網站推廣,域名注冊,中企動力” />
 
 ?。?)設置網頁描述信息
 
  <meta name=“description” content=“網站建設、網站制作專家中企動力,為您提供專業的展示型網站建設、營銷型網站建設、獨立商城系統網站建設、并提供一體化的企業郵箱”>
 
  HTML文本修飾標記
 
  <b></b>:加粗bold。如:<b>HTML文件</b>
 
  <i></i>:斜體italic。如:<i>HTML文本</i>
 
  <u></u>:下劃線underline。如:<u>HTML文本</u>
 
  <s></s>:刪除線strike。如:<s>刪除線</s>
 
  <sup></sup>上標。
 
  <sub></sub>下標。
 
  <font></font>字體標記
 
  屬性:Size:文本大小,取值1-7。1小,7大。
 
  Color:顏色值。
 
  Face:字體,楷體、黑體、宋體…
 
  HTML排版標記
 
  1.<p></p>表示一個段落。
 
  常用屬性:align:水平對齊方式,取值:left(左)、 center(居中)、 right(右)
 
  舉例:<p align=“center”>水平對齊方式居中對齊</p>
 
  2.換行標記<br>
 
  3.標題標記:<h1>……<h6>
 
  功能:定義各種標題。
 
  屬性:align水平對齊方式,取值:left、center、right。
 
  語法:<h1  align = “left | center | right”></h1>
 
  <div>和<span>標記
 
  <div>是沒有任何意義的標記,但是,又是使用最多的標記。<div>一般要與CSS配合使用。<div>是一個塊元素。
 
  <span>是沒有任何意義的標記,但是,又是使用最多的標記。<span>要與CSS配合使用。<span>是行內元素。
 
 ?。?)塊元素
 
  塊元素,一般是單獨占一行,不管內容多少,總是占一行。
 
  塊元素有哪些?<div>、<p>、<h1>、<h2>、<pre>等
 
 ?。?)行內元素
 
  行內元素,不會單獨占一行。
 
  行內元素的寬度,主要是根據內容決定。
 
  多個行內元素,會排在同一行。
 
  行內元素有哪些?<font>、<b>、<i>、<u>、<sub>、<sup>等
 
  結論:在標記嵌套時,一般是塊元素中嵌套行內元素。
 
  HTML項目符號(無序列表)
 
  <ul>
 
  <li>內容1</li>
 
  <li>內容2</li>
 
  <li>內容3</li>
 
  </ul>
 
  <ul>或<li>的常用屬性
 
  type:項目符號的類型,取值:disc(小黑點)、circle(空心圓)、square(實心方塊)
 
  注意:在HTML標記中,內容應該放在最底層標記中。
 
  注意:<ul>和<li>是塊元素。
 
  HTML編號列表(有序列表)
 
  <ol>
 
  <li>列表1</li>
 
  <li>列表2</li>
 
  <li>列表3</li>
 
  </ol>
 
  <ol>或<li>的常用屬性
 
  type:編號類型,取值:1、a、A、i、I
 
  start:從第幾個開始編號(數字)。
 
  圖片標記:行內元素,單邊標記
 
  語法格式:<img  屬性 = “值”>
 
  常用屬性:
 
  Width:圖片寬度
 
  Height:圖片高度
 
  Border:圖片邊框粗細。
 
  Src:圖片的路徑(相對路徑)
 
  Align:圖片的水平對齊方式,取值:left、center、right
 
  Hspace:圖片與左右文字之間的距離(水平距離)
 
  Vspace:圖片與上下文字之間的距離(垂直距離)。
 
  - 注意事項
 
  如果圖片想等比例縮放,只需要指定width或height其中一個。
 
  Align屬性只能讓文本居中,不能讓圖片單獨居中。
 
  Align可以實現“圖文混排”效果。align = “left | right”
 
  要想讓圖片實現居中效果,可以給圖片增加一個<div>元素
 
  表單
 
  1、表單的概念
 
  表單主要用來獲取客戶端用戶數據(信息)的。如:注冊表單、查詢表單、登錄表單等。
 
  2、表單的工作原理
 
  瀏覽有表單的網頁,填寫一些必要的信息,然后點擊某個按鈕進行提交。
 
  這些表單數據,通過互聯網,傳遞到了服務器上。
 
  服務器上有專門的程序,對表單數據進行驗證。如果驗證成功,將你的數據存入數據庫(MySQL),則返回一個驗證成功的信息。如果驗證失敗,將返回一個錯誤信息。
 
  從上面表單的工作原來看:表單的制作分兩個部分,一是前臺頁面的制作,二是后臺PHP對表單數據的處理。
 
  3、表單的結構
 
  <form>標記屬性——塊元素
 
  name:給表單起個名字。這個名字主要給JavaScript來用。JS主要用來做客戶端表單驗證。
 
  method:表單的提交方式,取值:get或post。
 
  action:指定表單的處理程序,一般是PHP文件。
 
  如果action為空,那么表單數據發到哪里去了?
 
  結果:那么表單數據提交給了它自己來處理。
 
  enctype:指定表單數據的編碼方式(解密方式)。這個屬性只能用在 method = “post” 的情況下。
 
  application/x-www-form-urldecoded  //默認的加密方式
 
  multipart/form-data  //如果你上傳文件,該值必須它自己。
 






轉載請保留本文網址http://www.venture-express.com/qqwd/webqd/269.html
上一篇:WEB前端培訓:CSS3 3D 轉換
下一篇:沒有了
日本强伦姧人妻久久,中日韩中文字幕无码一本,日本强伦姧护士在线观看 管家婆免费版| 日本香蕉在线中文旡码| 狠狠色综合网丁香五月| 偷拍区制服美腿清纯唯美| 国内学生处破女自拍| 国产av在线看的| 大红灯笼高高挂电影免费播放| 夜夜春宵| 日本三级在线播放线观看视频| 另类小说| 成人社区视频| 丫头别动我还在里面要断了| 先锋影音最新av资源网| 闺蜜把我腿打开用黄瓜自慰| 免费追剧大全电视剧网站| 红杏永久免费视频入口| 山东熟女啪啪哦哦叫| 青青热在线精品视频免费观看| 激情做爱| 国内久久这里只有精品| 手机偷拍福利在线| 手机在线观看的a站免费2020| 成人免费午a大片| 老司机精品线观看视频| 日本按摩高潮a级中文片| chinese农民工嫖妓videoos| japanese810sex| 四虎影视88aa四虎在钱| 日本XXXX色视频在线观看免费| 久久婷婷五月综合色国产| 99热国产这里只有精品无卡顿| http://www.wlmqrtjs.com