HTML入门

文本修饰标签

• 加粗

  <strong>加粗</strong>

• 斜体

  <em>斜体</em>

• 上标

  a<sup>2</sup>

• 下标

  a<sub>2</sub>

• 删除线

  <del>删除线</del>

• 下划线

  <ins>下划线</ins>

图片标签

<img src="" alt="" title="" width="" height="">

• src：图片路径
• alt： 图片加载失败显现文字内容
• title：图片标题，光标移到图片上显现
• width：图片宽度
• height：图片高度

超链接标签

<a href="" target="_blank">百度</a>

• href：链接地址，如http://www.baidu.com
• target: 默认为：_self 本页面跳转，_blank 跳转到新窗口

跳转锚点

• #号
• id属性

 <a href="#idname">点击跳转</a>
 <!-- 跳转目标 -->
 <h1 id="idname"></h1>

特殊字符

列表

无序列表

 <ul><li>li1</li><li>li2</li><li>li3</li></ul>

有序列表

<ol><li>li1</li><li>li2</li><li>li3</li></ol>

定义列表

<dl><dt>表头</dt><dd>dd1</dd><dd>dd2</dd></dl>

表格

<table border="1" cellspacing="0"><caption>天气预报（表格标题）</caption><thead><tr><th>日期</th><th>天气情况</th><th>出行情况</th></tr></thead><tbody><tr><td>2020/02/02</td><td>晴</td><td>事宜出门</td></tr></tbody><tfoot></tfoot></table><p>Ps：在一个table中toby可以出现多次 thead和tfoot只能出现一次</p>

表格属性：

• border：表格边框
• cellpadding：单元格内的空间
• cellspacing：单元格间的空间
• rowspan：合并行
• colspan：合并列
• align：水平对齐方式 left center right
• valign：竖直对齐方式 top middle bottom

表单标签

<form action="提交地址" method="post/get"><input type="" /><input type="radio" id="man"/><label for="man">男</label><textarea rows="" cols=""></textarea><select name=""><option value="" selected="selected" disabled="disabled">请选择</option><option value="">北京</option><option value="">上海</option><option value="">广东</option></select><select name="" size="2"><option value="" selected="selected" disabled="disabled">请选择</option><option value="">北京</option><option value="">上海</option><option value="">广东</option></select><select name="" multiple="multiple"><option value="" selected="selected" disabled="disabled">请选择</option><option value="">北京</option><option value="">上海</option><option value="">广东</option></select></form>

type属性：

• type="text": 文本输入框,为空时提示信息：placeholder="请输入用户名"
• type="password":密码输入框，为空时提示信息：placeholder="请输入密码"
• type="checkbox":复选框，默认选中： checked，禁止使用：disabled
• type="radio":单选框
• type="file":上环文件
• type="submit":提交按钮
• type="reset":重置按钮