Html基本用法

來源:互聯網
上載者:User

標籤:blank   列合并   串連   order   多個   圖片路徑   post   超過   method   

hmtl
 hyper text markup language
 超文字標記語言 (HTML)
 超文本:超越一般的文本 變色 加粗 變大 甚至設定超連結
 標記:瀏覽器已經定義好的 一些由角括弧括起來的特殊符號
 語言:使用者跟瀏覽器交流工具

 html檔案應該以.html結尾 (可以以.htm結尾不推薦)
 1.html語言 如果標籤有開始有結束 稱之為圍堵標記
 2.html語言中 如果標籤沒有標籤體 稱之為空白標記
 3.html語言不是怎麼規範語言 最好應該按照規範來
 4.html標籤不區分大小寫  國內開發人員喜歡小寫 最好小寫
 5.html語言中 標籤最好正確的嵌套
 6.標籤中可以有屬性:
  書寫格式  屬性名稱="屬性值"  "" ‘‘ "‘

 

文字類標籤:
  <hn></hn> n是一個可變數 取值範圍1-6
  <h1></h1>
   特點:
   加粗 換行 上下留白 從一到六越來越小
   常用屬性:
    align:對齊  left center right
  文字標籤:
   <font></font><br />
   常用屬性:
    color:顏色
    size:大小 1-7 1到7越來越大
    face:字型家族
    
    顏色的取值:
     1.直接顏色的英文單詞
     2.RGB 以#打頭跟上六個十六進位的數 #12345f
  <b></b>:加粗
  <strong></strong>:加粗  
  <i></i> :斜體
排版類標籤:
 <hr/>:水平線標籤
 常用屬性:
  width:寬度
  寬度取值:
   1.%百分比
   2.px
  align:對齊
 換列標籤
  <br/>
  
 段落標籤
  <p></p>
  常用屬性:
   align:對齊
   
圖片標籤:
  <img />
   常用屬性:
    src:指定圖片路徑
    alt:替代文字
    width:寬度
    height:高度
   路徑取值:
    1.相對路徑:
     當前路徑:./logo2.png ./可以不寫
     上級路徑:../img/logo2.png
    2.絕對路徑:
     http://img.baidu.com/xx.jpg
列表標籤
  ol:有序列表
  ul:無序列表
   常用屬性:
    ol:
    type:控制前面顯式樣式
     1:預設
     A
     a
     I
     i
    ul:
     type:
      disc:預設
      circle:空心圓
      square:方塊
 
  共同的子標籤
   li:清單項目
    超連結標籤:
  <a></a>
   常用屬性:
    href:跳轉的頁面的路徑
    target:跳轉的頁面的開啟檔案
     _blank:新開一個選項卡開啟
     _self:預設
     framename:在框架組裡顯示
    路徑取值:
     相對路徑:
      當前路徑:
      上級路徑:
     絕對路勁:網址
     #:跳轉到當前頁面
表格標籤:
 <table></table>
 常用屬性:
  border:px
  width:寬度
  height:高度
  cellspacing:表格線的間距
  align:對齊
 常用子標籤:
  <tr></tr>
 tr標籤  行
  常用屬性:
   bgcolor:背景顏色
   align:對齊
  常用子標籤:
   <td></td>:儲存格
    常用屬性:
     bgcolor:背景顏色
     align:對齊
     rowspan:行合并
     colspan:列合并
   <th></th>:表頭標籤
     特點: 加粗 置中
 轉義符:
  常用的轉義符:
   書寫格式
    &單詞;
   空格轉義符 : &nbsp;
   大於符號 >:   &gt; greate than
   小於符號 <:  &lt; less than
   &符號:  &amp;
form表單標籤:
 form表單標籤:
  <form></form>
   常用屬性:
    action:提交地址
    method:提交的方法
     get:
      預設提交方式
      參數會追加到url後面 ? 參數名=參數值&參數名=參數值
      資料最大不能超過1kb
     post:
      沒有資料大小限制
      不會跟在url後面
      較為安全
   常見子標籤:
    input:輸入框
     type:(10種)
      text:預設
      password:密碼框
      radio:單選框
      checkbox:多選框
      
      file:上傳檔案
      
      button:普通按鈕
      submit:提交按鈕
      reset:重設按鈕
      
      image:瞭解中瞭解
      
      hidden:隱藏欄位 
 
    select:下拉選擇框
     常用子標籤
      option
    textarea:文本域標籤
     常用屬性
     rows:行
     cols:列
   
  通用屬性:
   1.name屬性
    1.給單選框 多選框 分組
    2.如果你想要提交資料 必須給標籤一個name屬性 並且必須賦值
   2.value
    1.給按鈕類標籤起名
    2.單選多選框 提交資料的時候 你想要提交自己的想要值 value屬性 必須賦值
  設定預設值:
   1.普通文字框 密碼框  hidden設定預設值 給一個value屬性值 必須賦值
   2.給單選框 多選框設定預設值 給它設定一個checked屬性
   3.給select下拉選擇框設定預設值  給它的子標籤option設定 selected屬性
   4.給textarea設定預設值 直接在標籤體內寫內容即可
   
  ?username=tom&password=12345&gender=0&hobby=eat&hobby=sleep&avatar=&province=02&city=0201&desc=你好
  點擊提交按鈕 發生表單提交事件 提交資料
  在url後面跟上一個問號?參數名字=參數值
   如果有多個參數 &串連

Html基本用法

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.