1. 程式人生 > >JavaWeb_01_html基本學習

JavaWeb_01_html基本學習

ons row ini max-width sub 服務器 數據 ogre sans

JavaWeb01_html basic

html操作思想

  • 使用標簽把要操作的數據包起來,通過修改標簽的屬性值,來實現標簽內數據樣式的變化

font標簽

  • 屬性:size取值範圍1-7 color:英文單詞,十六進制數 #ffffff

標題標簽 <h1> </h1> ... <h6> </h6>

  • 從h1到h6越來越小,自動換行

註釋

  • <!-- html的註釋 -->

列表標簽

  • <dl> <dt></dt> <dd></dd> </dl>
  • 有序
  • 無序

圖像標簽

  • <img src="圖片的路徑" width="" height="" />
  • alt:瀏覽器的兼容性很差

路徑(相對路徑)

  • 在同一級目錄:直接寫
  • 在下一層目錄:images/1.jpg
  • 在上層目錄: ../

超鏈接標簽

<a href="路徑">顯示在頁面上的內容</a>

  • 打開方式 target=”_self _blank”
  • 默認是在當前頁面打開

表格標簽

<table>
    <tr>
        <td></td>
        <th></th>   <!--加粗和居中-->
    </tr>
</table>

html的五個規範

  • 一個html文件開始標簽和結束的標簽<html></html>
  • html包含兩部分內容
    • <head>設置相關信息</head>
    • <body>顯示在頁面上的內容都寫在body裏面</body>
  • html的標簽是成對的
  • html的代碼不區分大小寫
  • 有些標簽,在標簽內結束。比如換行:<br /> 分割線:<hr />

表單標簽

  • 可以提交數據到服務器,這個過程可以用表單標簽實現
  • <form></form>
    • action:提交到地址,默認提交到當前頁面
    • method:表單的提交方式
      • 常用的有兩種 get和post get默認就是get請求
    • enctype: 一般請求下不需要這個屬性,做文件上傳時候需要設置這個屬性
    • 面試題目:get和post區別
      • get請求地址欄會攜帶提交的數據,post不會攜帶
      • get請求安全級別較低,post較高
      • get請求數據大小的限制,post沒有限制
  • 輸入項:可以輸入內容過選擇內容的部分
    • 大部分的輸入項使用 <input type="輸入項的類型"/>
      • 普通輸入項:<input type="text"/>
      • 密碼輸入項:<input type="password"/>
      • 單選輸入項:<input type="radio"/>
        -> 在裏面需要屬性name
        -> name的屬性值必須要相同
        -> 必須有一個value值
      • 復選輸入項:<input type="checkbox"/>
        -> 在裏面需要屬性name
        -> name的屬性值必須要相同
        -> 必須有一個value值
      • 文件輸入項(在後面上傳時侯用到)
        -> <input type="file"/>
      • 下拉輸入項(不是在input標簽裏面的)
        <select name="birth">
            <option value="0">請選擇</option>
            <option value="1991">1991</option>
            <option value="1991">1992</option>
            <option value="1991">1993</option>
            <option value="1991">1994</option>
        </select>
        
      • 文本域
        <textarea cols="10" rows=""></textarea>
      • 隱藏項(不會顯示在頁面上,但是存在於html代碼裏面)
        <input type="hidden"/>
      • 提交按鈕
        <input type="submit"/>
        <input type="submit" value="註冊"/>
      • 使用圖片提交
        <input type="image" src="a.jpg"/>

html中其它的常用標簽的使用

  • b –加粗
  • s –刪除線
  • u –下劃線
  • i –斜體
  • pre –原樣輸出
  • subsup –下標和上標
  • div –自動換行
  • span –在一行顯示

html頭標簽的使用

  • html兩部分組成 head和body
    • 在head裏面的標簽就是頭標簽
    • title標簽:表示在標簽上顯示的內容
    • <meta>標簽:設置頁面的一些相關的內容
      • <meta name="keywords" content="學習,熊出沒"> –以前的搜索引擎檢索方式
      • <meta http-equiv="refresh" content="3; url=https://baidu.com"/> –三秒跳轉
    • base標簽:設置超鏈接的基本設置
      • 可以統一設置超鏈接的打開方式<base target="_blank" /> –設置全文超鏈接以新窗口打開
    • link標簽:引入外部文件
      • 可以使用link標簽引入css文件

框架標簽的使用

使用框架標簽的時候,不能寫在body裏面,使用了框架標簽,需要把body去掉

  • <frameset>標簽
    • rows:按照行進行劃分 <frameset rows="80, *">
    • cols:按照列進行劃分 <frameset cols="80, *">
  • <frame>標簽
    • 具體顯示的頁面
      • <frame name="lower_left" src="b.html">

後記

以上內容只是個人學習的記錄,其他未涉及的內容都可以在網絡上或手冊上查找的到。

另:此筆記是由markdown編寫,用sublime編譯成的html文檔

JavaWeb_01_html基本學習