当前位置：首页 > 行业动态 > 正文

如何正确查看HTML页面的源代码？

admin
行业动态
2024-10-03
1

HTML显示源码可以通过浏览器的开发者工具查看，或者右键点击页面并选择“查看网页源代码”。

HTML（超文本标记语言）是一种用于创建网页的标记语言，它使用一系列标签来定义网页的结构和内容，以下是一些常见的HTML标签及其用途：

如何正确查看HTML页面的源代码？第1张

1、<!DOCTYPE html>：声明文档类型，告知浏览器这是一个HTML5文档。

2、<html>：包含整个HTML文档的根元素。

3、<head>：包含关于文档的元数据，如字符编码、标题、样式表和脚本等。

4、<title>：定义文档的标题，显示在浏览器的标题栏或标签页上。

5、<meta charset="UTF8">：定义文档的字符编码为UTF8。

6、<link>：引入外部样式表。

7、<script>：嵌入客户端脚本，如JavaScript。

8、<body>：包含页面的所有内容，如文本、图像、链接等。

9、<h1>到<h6>，数字越大，字体越小。

10、<p>：定义段落。

11、<a href="url">：定义超链接，指向其他文档或页面。

12、<img src="image_url" alt="description">：插入图像，src属性指定图像的URL，alt属性提供图像的描述。

13、<ul>：定义无序列表。

14、<ol>：定义有序列表。

15、<li>：定义列表项。

16、<table>：定义表格。

17、<tr>：定义表格行。

18、<td>：定义表格单元格。

19、<form>：定义表单，用于收集用户输入。

20、<input type="text|password|submit">：定义输入控件，如文本框、密码框和提交按钮。

21、<textarea>：定义多行文本输入框。

22、<select>：定义下拉列表。

23、<option>：定义下拉列表中的选项。

24、<div>：定义文档中的一个分区或容器。

25、<span>：定义文档中的一个小片段。

以下是一个简单的HTML文档示例：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF8">
  <title>我的第一个HTML页面</title>
  <link rel="stylesheet" href="styles.css">
  <script src="script.js"></script>
</head>
<body>
  <h1>欢迎来到我的网站</h1>
  <p>这是一个简单的HTML页面。</p>
  <a href="https://www.example.com">点击这里访问Example网站</a>
  <img src="image.jpg" alt="示例图片">
  <ul>
    <li>项目1</li>
    <li>项目2</li>
    <li>项目3</li>
  </ul>
  <table>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
    </tr>
    <tr>
      <td>张三</td>
      <td>25</td>
    </tr>
    <tr>
      <td>李四</td>
      <td>30</td>
    </tr>
  </table>
  <form action="/submit" method="post">
    <label for="username">用户名：</label>
    <input type="text" id="username" name="username">
    <br>
    <label for="password">密码：</label>
    <input type="password" id="password" name="password">
    <br>
    <input type="submit" value="提交">
  </form>
</body>
</html>

这个示例包含了HTML的基本结构、文本、链接、图像、列表、表格、表单等元素，你可以根据自己的需求修改和扩展这个示例。

小伙伴们，上文介绍了“html 显示源码”的内容，你了解清楚吗？希望对你有所帮助，任何问题可以给我留言，让我们下期再见吧。