在HTML中创建一个图形验证码通常需要结合后端服务器和前端JavaScript库。以下是一个简单的示例，展示了如何在HTML页面上创建一个简单的图形验证码。请注意，这只是一个基本的示例，实际的验证码系统会更复杂，包括安全性措施和防止机器人识别等。
在后端服务器上生成验证码图片，然后将其发送到前端页面，这里假设你使用的是Python Flask框架来生成验证码图片，在HTML页面上显示这个验证码图片，并提供一个输入框让用户输入他们看到的验证码，用户输入的验证码将被发送到服务器进行验证。
这是一个简单的Python Flask服务器代码示例来生成验证码图片：
from flask import Flask, render_template, request
import random
import string
from PIL import Image, ImageDraw, ImageFont
app = Flask(__name__)
@app.route(’/captcha’)
def generate_captcha():
# 生成随机的验证码字符串
code = ’’.join(random.choices(string.ascii_uppercase + string.digits, k=5))
session[’captcha’] = code # 存储在session中以便验证用户输入是否正确
# 创建验证码图片并添加文字
image = Image.new(’RGB’, (200, 60), color=(255, 255, 255))
draw = ImageDraw.Draw(image)
font = ImageFont.truetype(’/usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf’, 15) # 使用系统字体文件路径替换此路径
draw.text((10, 10), code, font=font, fill=(0, 0, 0)) # 添加文字到图片上
# 保存图片到服务器临时目录并返回图片的URL给前端页面显示
image_path = ’/tmp/captcha_’ + str(random.random()) + ’.png’ # 随机文件名防止缓存问题
image.save(image_path) # 保存图片到服务器临时目录
return render_template(’captcha.html’, image_url=’/’ + image_path) # 返回HTML页面并带上图片URL参数供前端显示图片使用然后在HTML页面上显示这个验证码图片并让用户输入验证码：
<!-- captcha.html -->
<html>
<body>
<!-- 显示后端服务器生成的验证码图片 -->
<img src="https://www.qq959.com/static/image/lazy.gif" class="lazy" original="https://www.qq959.com/static/image/nopic320.png" image_url }}" alt="captcha">
<!-- 用户输入他们看到的验证码 -->
<input type="text" id="captchaInput" placeholder="请输入验证码">
</body>
</html>当用户提交表单时，你需要将用户输入的验证码发送到服务器进行验证，这可以通过AJAX请求实现，或者使用表单提交，这只是一个基本的示例，实际的验证码系统需要考虑更多的安全性和可用性方面的问题，你可能需要使用更复杂的图像生成技术来防止机器人识别，或者使用第三方库如Google reCAPTCHA等。
