Community Learn Tools Library Leisure
search
English
Home > List of blog posts > HTML常用标签
Blogger Information
Blog 16
fans 0
comment 0
visits 12335
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
HTML常用标签
大碗宽面
Original
1072 people have browsed it

一、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>
  4.     <p>
  5.       几许人是惊世才<br />
  6.       不见当年李太白
  7.     </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>

Correcting teacher：PHPzPHPz

Correction status：qualified

Teacher's comments：
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post