JavaWeb - HTML基础
标签
font 文本标签
<font face="黑体" color="#0099FF">黑体效果</font> <font size="3" color="#990000">3号文字效果</font> <!-- face=字体样式，color=颜色，size：字体大小 -->p 段落标签、br 换行标签
本段落内容...<p> 第二段内容<p> 第三段内容<br> 第四行内容...<br> 第五行内容 <!-- 标签区别：p标签换行但是带的默认间距比br大 -->strong 粗体文本、em 斜体文本、u 带下划线文本、sup 上标文本、sub 下标文本
<strong>粗体文字</strong> <em>斜体文字</em> <u>下划线文字</u> <sup>上标文字</sup> <sub>下标文字</sub> <!-- 上下标举例使用 --> H<sub>2</sub>O:氢气 A<sup>2</sup>+B<sup>2</sup>=1常见特殊符号
<!-- 小于号：< --> 7<9 <!-- 空格符： --> 在  吗=在 吗 <!-- 版权符：© --> © Copyright xxx公式版权所有a 超链接标签、img 图片标签
<!-- a标签不加target默认为_self：直接在当前窗口打开，_blank：新建窗口打开 --> <a href="http://www.baidu.com">百度一下</a> <a href="http://www.baidu.com" target=_self>百度一下</a> <a href=http://www.baidu.com target=_blank>百度</a> <!-- img标签 --> <!-- 图片路径可使用本地相对路径或超链接路径 --> <img src="图片路径"> <img src="x.jpg" width=300px;height=90px> <!-- width：定义显示宽度，height：定义显示高度 -->audio 音频标签、video 视频标签
<!-- src:资源位置，本地相对或外链 --> <audio src="./video/1.mp3" controls></audio> <video src="./video/1.mp4" controls></video>列表标签：ul、ol
<!-- 无序列表 --> <ul> <li>111</li> <li>111</li> <li>111</li> </ul> <br> <br> <!-- 有序列表 --> <ol> <li>222</li> <li>222</li> <li>222</li> </ol> <!-- 有序字母显示 --> <ol type=A> <li>3333</li> <li>3333</li> <li>3333</li> <li>3333</li> <li>3333</li> </ol>表格标签
<!-- 表格标签 table --> <table></table> <!-- th：表头（默认居中） --> <table> <th>表头xxx</th> </table> <!-- tr：行、td：单元格 --> <table> <th>表头xxx</th> <tr> <td>第一个单元格（除表头外）</td> </tr> </table> <!-- table属性：border：边框，cellspacing：边框间距，align：对其方式，width、height：宽、高 --> <table border=1 cellspacing=0 align=center width=80%></table> <!-- 合并单元格：colspan：合并列（左右合并）、rowspan：合并行（上下合并） --> <th colspan=5 >合并5列</th> <th rowspan=5 >合并5行</th> <!-- 课程表实例 --> <!-- 课程表 --> <table border=1 cellspacing=0 align=center width=80%> <th></th> <th colspan=5 align=center>课程表</th> <tr align=center> <td rowspan=5>上午</td> <td>星期一</td> <td>星期二</td> <td>星期三</td> <td>星期四</td> <td>星期五</td> </tr> <tr align=center> <td>综合实践活动</td> <td>数学</td> <td>语文</td> <td>数学</td> <td>语文</td> </tr> <tr align=center> <td colspan=5>课间操</td> </tr> <tr align=center> <td>数学</td> <td>语文</td> <td>语文</td> <td>校本课程</td> <td>劳动</td> </tr> <tr align=center> <td colspan=5>眼保健操</td> </tr> <tr align=center> <td rowspan=3>下午</td> <td>语文</td> <td>书法</td> <td>数学</td> <td>语文</td> <td rowspan=2>美术</td> </tr> <tr align=center> <td rowspan=2>体育与健康</td> <td>地方课程</td> <td>音乐</td> <td>学校课程</td> </tr> <tr align=center> <td>音乐</td> <td>英语</td> <td>体育与健康</td> <td>科学</td> </tr> </table>form 表单
<!-- action：提交位置URL,#:本地 ----- method：提交方式 get：提交给当前页面，4kB（x=xxx显示提交） post （url不显示提交，在协议head里） ----- name=xxx（DB中的键名） ----- 单选框：radio 复选框：checkbox <input type=xxx name=xxx(与DB中一致且本框内相同) value=提交值 >显示内容 <input type=xxx name=xxx(与DB中一致且本框内相同) value=提交值 >显示内容 <input type=xxx name=xxx(与DB中一致且本框内相同) value=提交值 >显示内容 ----- 下拉框：select <select name=xxx > <option value=>xxx</option> <option value=>xxx</option> <option value=>xxx</option> </select> ----- 文本域：textarea <textarea></textarea> --> <!-- 实例 --> <form action=# method=post > 用户名<input type=text name=username> <br><br> 电话 <input type=text name=phone> <br><br> 性别 <input type=radio name=sex value=male>男 <input type=radio name=sex value=female>女 <br><br> 兴趣 <input type=checkbox name=like vlaue=摸鱼>上班 <input type=checkbox name=like vlaue=划水>加班 <input type=checkbox name=like vlaue=吹牛>倒班 <br><br> 密码<input type=password name=pass> <br><br> 头像<input type=file> <br><br> 留言：<textarea rows="5" cols="3"></textarea> <!-- 三行五列文本框 --> <br><br> <input type=submit value=注册> <!-- value：提交按钮显示文本 --> <br> </form>