在HTML中，你可以使用HTML和JavaScript来创建一个简单的验证码输入系统。以下是一个基本的示例，它使用HTML和JavaScript生成一个验证码并将其显示在输入框旁边。请注意，这只是一个基本的示例，实际的验证码系统可能需要更复杂的安全措施和服务器端验证。
HTML部分：
<!DOCTYPE html>
<html>
<head>
<title>验证码输入</title>
</head>
<body>
<h2>请输入验证码：</h2>
<input type="text" id="captchaInput" placeholder="请输入验证码">
<img id="captchaImage" src="https://www.271shop.com/static/image/lazy.gif" class="lazy" original="https://www.271shop.com/static/image/nopic320.png" onclick="this.src="https://www.271shop.com/static/image/lazy.gif" class="lazy" original="https://www.271shop.com/static/image/nopic320.png" alt="验证码图片">
</body>
</html>在这个例子中，我们有一个文本输入框用于用户输入验证码和一个图像标签用于显示验证码图片，图像标签的src属性设置为一个PHP脚本（假设为captcha.php），该脚本生成并显示验证码，点击图像时，通过添加随机数来刷新图像，从而强制浏览器重新加载新的验证码。
JavaScript部分（服务器端生成验证码）：
服务器端生成验证码的代码取决于你使用的服务器语言和框架，这里是一个简单的PHP示例，用于生成验证码并将其发送到浏览器：
<?php
session_start(); // 开始会话管理，用于存储用户输入的验证码
$random_number = rand(1000, 9999); // 生成一个四位数随机验证码
$_SESSION[’captcha’] = $random_number; // 将验证码存储在会话中，以便后续验证用户输入是否正确
header("Content-type: image/png"); // 设置响应头为PNG图像格式
$image = imagecreate(50, 24); // 创建一个宽度为50像素，高度为24像素的图像资源
$background = imagecolorallocate($image, 255, 255, 255); // 设置背景颜色为白色
$text_color = imagecolorallocate($image, 0, 0, 0); // 设置文本颜色为黑色
imagestring($image, 5, 0, 0, $random_number, $text_color); // 在图像上写入验证码数字字符串
imagepng($image); // 输出图像为PNG格式到浏览器或文件
imagedestroy($image); // 销毁图像资源以释放内存空间
?>这只是一个非常基础的示例，实际的验证码系统可能需要更复杂的逻辑和安全性措施来保护你的网站免受恶意攻击，你可能需要添加更多的字符类型（如字母和数字），使用更复杂的图像生成技术（如添加噪声和扭曲），以及服务器端验证用户输入的验证码是否正确等。
