[分享]css中如何设置输入框的格式

CSS可以帮助我们设置输入框的格式，让输入框在页面中更加美观和易于使用。下面介绍一些常见的设置方式：// 设置输入框的宽度和高度 input { width: 200px; height: 30px;...

CSS可以帮助我们设置输入框的格式，让输入框在页面中更加美观和易于使用。下面介绍一些常见的设置方式：

// 设置输入框的宽度和高度
input {
  width: 200px;
  height: 30px;
}

// 设置输入框的外边框样式
input {
  border: 2px solid #ccc;
  border-radius: 5px;
}

// 设置输入框内文本的样式
input {
  font-size: 16px;
  color: #333;
}

// 设置输入框的背景色和占位符文本样式
input {
  background-color: #f7f7f7;
  placeholder {
    color: #999;
    font-style: italic;
  }
}

// 设置输入框的光标样式
input:focus {
  border-color: #6dbdff;
  box-shadow: 0 0 5px #6dbdff;
} 

除了上述设置方式，还可以使用伪类选择器等其他CSS技巧来美化输入框的样式。例如，可以使用:hover伪类选择器设置输入框的悬停状态，使用:checked伪类选择器设置复选框或单选框的样式等。