如何添加二维码在html

在HTML中添加二维码，可以使用<img>标签或者使用JavaScript库，这里我将分别介绍这两种方法。

方法一：使用<img>标签

1、你需要一个二维码图片，你可以使用在线的二维码生成器（如：https://qrcode.top/）生成一个二维码图片，并将其保存到你的服务器或者本地。

2、在HTML文件中，使用<img>标签将二维码图片引入，如果你的二维码图片名为qrcode.png，并且位于与HTML文件相同的目录下，你可以这样引用：

<img src="qrcode.png" alt="二维码">

3、如果需要调整二维码的大小，可以使用width和height属性，将二维码大小设置为200像素宽和200像素高：

<img src="qrcode.png" alt="二维码" width="200" height="200">

方法二：使用JavaScript库（如：jquery.qrcode）

1、在你的HTML文件中引入jQuery库和jquery.qrcode插件，你可以通过以下方式引入：

<script src="https://code.jquery.com/jquery3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0.0/jquery.qrcode.min.js"></script>

2、接下来，在HTML文件中创建一个用于显示二维码的<div>元素，并为其分配一个唯一的ID。

<div id="qrcode"></div>

3、在HTML文件中的<script>标签内，编写JavaScript代码来生成二维码。

<script>
  $(document).ready(function() {
    $('#qrcode').qrcode({
      text: 'https://www.example.com', // 你想要生成二维码的链接或文本
      width: 200, // 二维码宽度
      height: 200, // 二维码高度
      colorDark : "#000000", // 二维码深色部分的颜色
      colorLight : "#ffffff", // 二维码浅色部分的颜色
      correctLevel : QRCode.CorrectLevel.H // 二维码纠错级别（可选）
    });
  });
</script>

4、保存HTML文件并在浏览器中打开它，你应该能看到一个根据你提供的链接或文本生成的二维码。

归纳一下，在HTML中添加二维码有两种方法：使用<img>标签和使用JavaScript库，使用<img>标签的方法相对简单，但功能有限；而使用JavaScript库的方法可以提供更多自定义选项，但需要引入额外的库，你可以根据自己的需求选择合适的方法。