博客列表 >HTML常用标签

HTML常用标签

大碗宽面
大碗宽面原创
2021年09月25日 16:24:511071浏览

一、HTML文档标签


1.<!DOCTYPE html>

文档声明为HTML 标识网页是遵循html5语法规范

2.<html lang="en">

html网页中根标签,一个页面中有且只有一个根标签,网页中的所有内容都写在根标签的内部

3.<head>

网页的头部,head标签中的内容,不会在页面中直接显示

4.<meta charset="UTF-8" />

使用meta来设置页面的字符集

5.<title>Document</title>

网页的标题

6.<body>

网页的主体,网页中所有的可见内容,都写在body中


二、html常用标签

1.标题标签h1~h6共六级标题h1最大 h6最小

  1. <h1>一级标题标签</h1>
  2. <h2>二级标题标签</h2>
  3. <h3>三级标题标签</h3>
  4. <h4>四级标题标签</h4>
  5. <h5>五级标题标签</h5>
  6. <h6>六级标题标签</h6>

2.段落标签p,块级元素 独占一行

  1. <p>2021/09/19</p>
  2. <p>中秋节放假三天</p>
  3. <p>
  4. 几许人是惊世才<br />
  5. 不见当年李太白
  6. </p>

3.链接标签a 跳转到指定的链接

  1. <a href="https://www.php.cn/">php中文网</a>

4.无序列表ul,li 定义无序列表

  1. <ul>
  2. <li>item</li>
  3. <li>item</li>
  4. <li>item</li>
  5. <li>item</li>
  6. </ul>

5.图像标签img

  1. <img src="1.png" alt="" title="" width="200px" height="200px" />

6.有序列表ol,li 定义有序列表

  1. <ol>
  2. <li>item</li>
  3. <li>item</li>
  4. <li>item</li>
  5. <li>item</li>
  6. </ol>

7.自定义列表dl,dt,dd

  1. <dl>
  2. <dt>四大名著</dt>
  3. <dd>西游记</dd>
  4. </dl>
  5. <dl>
  6. <dt>四大名著</dt>
  7. <dd>红楼梦</dd>
  8. </dl>
  9. <dl>
  10. <dt>四大名著</dt>
  11. <dd>水浒传</dd>
  12. <dd>三国演义</dd>
  13. </dl>

8.表格table,tr,td

  1. <table border="1" width="500px" height="200px">
  2. <tr>
  3. <td>x</td>
  4. <td>x</td>
  5. <td>x</td>
  6. <td>x</td>
  7. </tr>
  8. <tr>
  9. <td colspan="3" align="center">横线水平合并3个X</td>
  10. <!-- <td>x</td>
  11. <td>x</td>-->
  12. <td rowspan="3" align="center">向下垂直合并三个X</td>
  13. </tr>
  14. <tr>
  15. <td>x</td>
  16. <td>x</td>
  17. <td>x</td>
  18. <!-- <td>x</td> -->
  19. </tr>
  20. <tr>
  21. <td>x</td>
  22. <td>x</td>
  23. <td>x</td>
  24. <!-- <td>x</td> -->
  25. </tr>
  26. </table>

9.表单form

1.文本域text

  1. <form action="" method="">
  2. 账号:<input type="text" />
  3. </form>

2.密码password

  1. <form action="" method="">
  2. 密码:<input type="password" name="pwd" />
  3. </form>

3.单选框radio

  1. <form action="" method="">
  2. <input type="radio" name="sex" value="boy"/>
  3. <input type="radio" name="sex" value="gril"/>
  4. </form>

4.多选框checkbox

  1. <form action="">
  2. 学生:<input type="checkbox" name="state" value="xuesheng" />
  3. 在职:<input type="checkbox" name="state" value="zaizhi" />
  4. 无业:<input type="checkbox" name="state" value="wuye" />
  5. </form>

5.提交按钮submit,button

  1. <form action="">
  2. 账号名称:<input type="text" name="user" />
  3. <input type="submit" value="submit" />
  4. <input type="button" value="按钮" />
  5. </form>

6.重置按钮reset

  1. <form action="">
  2. 账号:<input type="text" /> 密码:<input type="password" />
  3. <input type="reset" value="重置" />
  4. </form>

9.下拉框select

  1. <select name="" id="">
  2. <option value="">北京</option>
  3. <option value="">上海</option>
  4. <option value="" selected="selected">广州</option>
  5. <option value="">深圳</option>
  6. </select>

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议