1. 程式人生 > >Java-JavaWeb-HTML

Java-JavaWeb-HTML

區別 菜單 lec cin 傾斜 文件名 -html lan pos

  • 簡介
    • 超文本標記語言
      • hypertext markup language
    • 文件後綴:html或者htm,直接使用瀏覽器打開
  • 規範
    • 不區分大小寫
    • 包含開始標簽和結束標簽 ,有些是單獨存在的<br/><hr/>
    • <html></html><head></head><body></body>
  • 操作思想
    • 用標簽將數據進行封裝,通過修改標簽的屬性值對數據進行修飾
  • 常用標簽
    • 文字標簽
      • <font><font/>
        • 屬性:
          • size:取值1-7
          • color:
            • 英文單詞
            • 十六進制#66cc66
    • 註釋標簽
      • <!--balbala-->
    • 標題標簽
      • <h1><h1/><h2></h2>....<h6></h6>
      • 大小依次變小
      • 自動換行
    • 水平線標簽
      • <hr size="3" color="black"/>
        • 屬性
          • size:1-7,表示水平線的粗細
          • color
    • 轉義字符
      • < &lt;
      • > &gt;
      • 空格 &nbsp;
      • & &amp;
    • 列表標簽
      • <dl></dl>
        • <dt></dt>
          • 上層內容
        • <dd></dd>
          • 下層內容
    • 有序列表
      • <ol></ol>
      • 屬性type,值:1 a i 用於設置序號的樣式
        • <li></li>
    • 無序列表
      • <ul></ul>
      • 屬性:type,值:circle disc square 用於設置標號的樣式
        • <li></li>
    • 圖像標簽
      • <img src="圖片路徑"/>
      • 屬性:
        • width
        • height
        • alt:鼠標停留時顯示的文字,有些瀏覽器中無效
    • 路徑
      • 絕對路徑
        • c:\Users\windows\1.html
        • http://www.baidu.com/1.html
      • 相對路徑
        • html和圖片在同一路徑
          • 直接寫圖片的文件名
        • 圖片在html的下一層目錄
          • 寫img/1.bmp
        • 圖片在html的上一層目錄
          • ../1.bmp
    • 超鏈接
      • 連接資源
        • <a href="資源路徑">文字</a>
        • 屬性
          • target:設置打開的方式,當前頁/新標簽頁
            • _blank
              • 新窗口中打開
            • _self
              • 默認值,當前窗口打開
        • 若不需要打開任何資源
          • href="#"
      • 定位資源
        • <a name="top">頂部</a>
        • <a href="#top">回到頂部</a>
    • 原樣輸出
      • <pre>xxx</pre>
    • 表格標簽
      • <table></table>
        • 屬性
          • border
          • bordercolor
          • cellspacing
          • width
          • height
          • align:居中左右
        • 定義1行
          • <tr>...</tr>
        • 定義單元格
          • <td>...</td>
        • 定義居中加粗的單元格
          • <th>..</th>
        • 表格標題
          • <caption>...</caption>
            • 寫在<table>標簽的下方
        • 合並單元格
          • 單元格中定義屬性colspan\rowspan
            • <td colspan="3">...</td>跨列,橫向覆蓋3個單元格
    • 表單標簽
      • 典型應用:註冊時填寫的各項信息
      • 可以提交數據至服務器
      • <form></form>
        • 屬性
          • action:
            • 提交到的地址,默認是當前頁面
          • method
            • 值:get\post
              • get是默認
              • get有數據大小的限制
              • get會在地址欄顯示提交的數據
              • get的安全級別較低
              • get與post 的區別
                • 1-get會在請求地址欄中攜帶提交的數據,post不會攜帶
                • 2-get請求安全級別較低
                • 3-get請求有數據大小的限制,post沒有限制
          • enctype
            • 文件上傳時需要
        • <input type="表單的類型" name="xx"/>
          • type屬性:
            • text
            • password
            • radio
              • 單選框
              • name 的值要相同
              • 需要value值
              • checked="checked"
                • 默認選項
              • 例子
                • 性別<input type="radio" name="sex" value="male"/>男 <input type="raido" name="sex" value="female"/>女
            • checkbox
              • 復選框
              • name 的值要相同
              • 需要value值、
              • 有checked屬性,true/false
            • hidden
            • file
            • submit
              • <input type="submit" value="註冊"/>
            • reset
            • button
        • 下拉菜單<select name="birth"></select>
          • <option value="1990">1990</option>
            • 默認項屬性
              • selected="selected"
        • 文本域textarea
          • <textarea cols="10" rows="10"></textarea>
        • 隱藏項:
          • <input type="hidden"/>
        • 提交按鈕
          • 使用文字形式的按鈕<input type="submit" value="註冊"/>
          • 使用圖片形式的按鈕<input type="image" src="圖片路徑"/>
        • 重置按鈕
          • <input type="reset" value="重置"/>
        • 普通按鈕
          • <input type="button" value="按鈕"/>
    • 其他標簽
      • b加粗
      • i傾斜
      • u下劃線
      • s刪除線
      • p段落標簽
      • pre原樣輸出
      • sub
      • sup
      • div
        • 自動換行
      • span
        • 在同一行顯示
    • 頭標簽
      • <head></head>
      • 在頭標簽中有以下一些標簽
        • <title>
        • <meta>
          • 設置頁面的一些相關內容
          • 設置定時刷新
        • <base>
          • 設置超鏈接的基本設置
          • <base target="_blank"/>
            • 超鏈接在新窗口中打開
        • link
          • 引入文件
    • 框架標簽
      • 不能和body標簽同時使用
      • <frameset></frameset>
        • 用來定義頁面的區域劃分
        • 屬性
          • cols
            • 按列劃分
          • rows,值"80,*"
            • 按行劃分,
      • <frame name="left" href="1.html"></frame>
        • 定義每個區域裏面的內容

Java-JavaWeb-HTML