Java學習：HTML入門
HTML
HTML基本標簽
<html> --html開始標簽
<head> -- 文件頭（用戶在瀏覽器的主體是看不到的）
</head>
<body> --文件體（用戶在瀏覽器的主體看得到）
</body>
</html> --html結束標簽
<!-- -->這是html的註釋標簽的形式。
<meta http-equiv="content-type" content="text/html;charset=utf-8"/> 元素可提供有關頁面的元信息（meta-information），比如針對搜索引擎和更新頻度的描述和關鍵詞。
文本標簽
標題(h1~h6) align：設置位置
水平線(hr) color：線的顏色
換行(br)
標簽規定粗體文本(b)
將文本以斜體顯示(i)
將文本以下劃線顯示(u)
段落(p)(書寫兩段小說進行演示)
段落縮進(blockquote)(主要用於解釋或者強調)
上下標(sup和sub)(一般用於公式)y=x2 H2O CaCo3
原樣輸出(pre)(希望網頁上的東西和代碼裏面寫的樣式完全一樣的時候)
marquee:
behavior屬性值(alternata:來回滾動 scroll:重復滾動 slide:不重復滾動
bgcolor:字幕背景顏色
direction:設置字幕的滾動方向down right left up
bgsound:
src:需要播放的音樂路徑
loop=-1(無限循環)
autostart="true"自動播放
列表標簽：
有序列表ol li（type屬性更改序號類型，案例：投票喜歡的女明星）
無序列表ul li（用於條目的羅列，type屬性更改序號類型，案例：學生管理系統）
項目列表標簽(dl dt dd)（一般用於有層次結構的列表，一個公司員工的列表）
下拉選項：<select/><option/>
行內標簽(span) (html中用的非常少，css中用的非常多)
塊標簽<div> (html中用的非常少，css中用的非常多)
超鏈接標簽
超鏈接標簽：<a></a>
兩個屬性：href:設置這個超鏈接需要連接到的資源
target:設置打開資源的方式
超鏈接 ：默認的協議為file://
協議：
file:// 本地文件協議
http:// 網絡上我們一般請求都使用的是http://，這個協議是基於請求和相應的
thunder:// 迅雷下載協議
mailto: 發送郵件的協議
協議的執行流程：
thunder://www.movie.com/shujiaoba.avi：會將這個超鏈接分為兩個部分，
一個是資源地址，一個協議名稱，因為我們在安裝每一個軟件的時候，每一個軟件都會在
我們的註冊表中註冊相應的協議，找你的註冊表中有哪些軟件註冊了該協議，那個軟件註冊了
，就會打開那個軟件
超鏈接作用；
1）鏈接到資源
2）作為錨點使用
打錨點： <a name="錨點名稱"></a>
去到錨點： <a href="#錨點名稱">內容</a>
1 <body> 2 <a name="top"></a> 3 <a href="http://www.baidu.com" target="_blank">超鏈接</a><br /> 4 <a href="thunder://www.movie.com/shujiaoba.avi">摔跤吧爸爸_迅雷專用通道</a> 5 <a href="mailto:[email protected]">發送郵件</a> 6 <a href="#content1">第一章節</a> 7 8 <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 9 10 <a name="content1"></a> 11 小說第一個章節的內容小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的小說第一個章節的 12 <a href="#top">回到頂部</a> 13 14 </body>
img（圖片）標簽
圖片標簽：img
圖片標簽的屬性：
src:連接的圖片的位置
width：圖片的寬度
height:圖片的高度
alt:提示文本，當src屬性是小的時候，alt屬性才生效
title:當鼠標放到這張圖片上的時候，會給與一個文字提示
1 <body> 2 <img src="b.jpg" alt="我是寶強" width="100" height="100" border="0" usemap="#Map" title="我是寶強"/> 3 <map name="Map" id="Map"> 4 <area shape="rect" coords="27,17,64,71" href="2.文本標簽.html" target="_blank" /> 5 <area shape="circle" coords="84,22,11" href="3.超鏈接標簽.html" target="_blank" /> 6 </map> 7 </body>
表格標簽
table:整張表就用一個table來表示
caption:表的標題
tr:代表表中的一行
td:表中的一個單元格
th:表頭，一般用於加粗顯示字段名稱
border:table標簽的一個屬性，用來調整表框的寬度
width:調整表的寬度
height:調整表格的高度
align:調整表格的位置
行合並和列合並：
行合並：rowspan
列合並：colspan
1 <body> 2 <table border="2" align="center" width="400" height="300"> 3 <caption><h1>學科成績統計表<h1></caption> 4 5 <tr align="center"> 6 <th>姓名</th> 7 <th>學科</th> 8 <th>成績</th> 9 </tr> 10 11 <tr align="center"> 12 <td rowspan="2">狗娃</td> 13 <td>音樂</td> 14 <td>90</td> 15 </tr> 16 17 <tr align="center"> 18 <td>java</td> 19 <td>60</td> 20 </tr> 21 22 <tr align="center"> 23 <td>狗剩</td> 24 <td>java</td> 25 <td>70</td> 26 </tr> 27 28 <tr align="center"> 29 <td>狗蛋</td> 30 <td>java</td> 31 <td>80</td> 32 </tr> 33 34 <tr align="center"> 35 <td colspan="2">平均分</td> 36 <td>70</td> 37 </tr> 38 39 </table> 40 41 </body>
轉義字符
< <
> >
& &
空格
商標 ®
版權 ©
1 <h1>標題1</h1><br/> 2 &<br /> 3 <hr /> 4 西部 開源 5 6 <hr /> 7 王老吉<sup>®</sup> 8 <hr /> 9 王老吉<sup>©</sup>
表單標簽
<form> 就是一個表單
<input type="text"> 單行輸入域
<input type="password"/> 密碼輸入域
<input type="radio"/> 單選按鈕
<input type="checkbox"/> 多選按鈕
<select/> 下拉選項
<input type="hidden"/> 隱藏域。特點：不會顯示到html頁面上，但可以攜帶數據。
<input type="file"/> 文件選擇器
<textarea></textarea> 多行輸入域
<input type="submit"/> 提交按鈕
<input type="button"/> 普通按鈕
<input type="reset"/> 重置按鈕
1 <body> 2 <form action="5.轉義字符.html" method="post"> 3 用戶名:<input type="text" value="請輸入用戶名" name="username"/><br /> 4 密碼:<input type="password" name="password"/><br /> 5 性別:<input type="radio" name="gender" value="男"/>男<input type="radio" name="gender" value="女"/>女<br /> 6 興趣愛好:<input type="checkbox" name="hobby" value="籃球"/>籃球<input type="checkbox" name="hobby" value="足球"/>足球<input type="checkbox" name="hobby" value="乒乓球"/>乒乓球<br /> 7 學歷: 8 <select name="xueli"> 9 <option value="benke">本科</option> 10 <option value="shuoshi">碩士</option> 11 <option value="boshi">博士</option> 12 </select><br /> 13 <input type="hidden" /><br /> 14 上傳一張你的靚照:<input type="file" name="file"/><br /> 15 請簡單做一個自我介紹：<textarea rows="5" cols="10"></textarea><br /> 16 <input type="submit" value="註冊"/> 17 <input type="reset" value="重置"/> 18 </form> 19 </body>
Java學習：HTML入門