HTML怎么在文本框内加入图标

你可以在文本框内加入图标，可以使用CSS中的background-image属性。以下是一个示例：

input[type="text"] {
  background-image: url("icon.png");
  background-size: 20px 20px;
  background-position: 10px center;
  background-repeat: no-repeat;
  padding-left: 40px;
}

这将会在所有type属性为"text"的input元素的左侧加入一个20x20像素的图标，并且文本框的左侧有40像素的内边距，避免文字与图标重合。

你可以替换"url('icon.png')"为你自己的图标路径，调整图标大小和位置来适应你的需求。

相关问题

Canvas下在文本框内写字

在 Canvas 中，我们可以通过创建一个文本框（`<input>` 元素）来接受用户输入的文本，然后使用 Canvas 的 `fillText()` 方法将文本绘制到画布上。

以下是一个示例代码：

HTML：

<input type="text" id="textInput">
<canvas id="myCanvas"></canvas>

JavaScript：

// 获取文本框和画布元素
var textInput = document.getElementById("textInput");
var canvas = document.getElementById("myCanvas");

// 获取画布上下文
var ctx = canvas.getContext("2d");

// 监听文本框的输入事件
textInput.addEventListener("input", function() {
  // 清空画布
  ctx.clearRect(0, 0, canvas.width, canvas.height);

  // 获取文本框输入的内容
  var text = this.value;

  // 设置字体样式
  ctx.font = "30px Arial";

  // 在画布上绘制文本
  ctx.fillText(text, 50, 50);
});

以上代码中，我们通过 `addEventListener()` 方法监听文本框的输入事件，当用户输入文本时，清空画布并获取文本框中的值，然后设置字体样式并使用 `fillText()` 方法将文本绘制到画布上。

html和js实现在表单文本框内写入随机数

可以使用 JavaScript 实现在表单文本框内写入随机数，具体实现步骤如下：

1. 在 HTML 页面中，定义一个表单和一个文本框：

<form>
  <label>随机数：</label>
  <input type="text" id="randomNumber" name="randomNumber">
  <button type="button" onclick="generateRandomNumber()">生成随机数</button>
</form>

2. 在 JavaScript 中，定义一个函数 `generateRandomNumber()`，用来生成随机数并将其写入文本框中：

function generateRandomNumber() {
  // 生成 0 到 999 的随机数
  var randomNumber = Math.floor(Math.random() * 1000);
  // 将随机数写入文本框
  document.getElementById('randomNumber').value = randomNumber;
}

当用户点击“生成随机数”按钮时，`generateRandomNumber()` 函数会生成一个 0 到 999 的随机数，并将其写入表单文本框中。