怎样给文本框填充背景颜色

[HTML中的文本框背景色设置]

在HTML中，如果是一个input类型为text的文本框，可以使用内联样式或者CSS样式表来设置背景颜色。 1. 内联样式： - 示例代码：<input type="text" style="background - color: lightblue;">。这里直接在input标签中使用style属性来设置背景颜色为浅蓝色（lightblue）。 2. CSS样式表： - 首先在HTML中给文本框一个id或者class属性，例如<input type="text" id="myTextBox">。 - 然后在CSS中设置背景颜色，在<style>标签内或者外部的CSS文件中，可以这样写： - #myTextBox {background - color: lightgreen;}（如果使用id选择器）或者.myTextBox {background - color: yellow;}（如果使用class选择器）。

[CSS中的文本框背景色设置（更通用的方法）]

如果是在纯CSS中，对于文本框（这里假设是一个具有input类型为text的元素或者是一个textarea元素），可以使用以下方式： 1. 针对所有文本框： - 可以使用元素选择器，例如： - input[type = "text"], textarea {background - color: orange;}。这个选择器会选中所有input类型为text的元素和textarea元素，并将它们的背景颜色设置为橙色。 2. 特定类或ID的文本框： - 如前面所述，先给文本框定义id或者class，然后在CSS中进行针对性设置。例如，如果有一个类名为specialTextBox的文本框： - .specialTextBox {background - color: pink;}。

[在JavaScript中动态设置文本框背景色]

在JavaScript中，可以动态地改变文本框的背景颜色。假设已经有一个HTML文本框<input type="text" id="dynamicTextBox">。 1. 直接修改样式属性： - 可以使用document.getElementById方法获取到这个元素，然后修改它的style属性中的backgroundColor（注意这里是驼峰命名法）。例如： - let textBox = document.getElementById('dynamicTextBox'); textBox.style.backgroundColor ='red';。 2. 基于事件改变背景色： - 例如，当用户点击文本框时改变背景色。可以给文本框添加一个click事件监听器： - textBox.addEventListener('click', function {this.style.backgroundColor = 'purple';});。