[分享]css3怎么设置输入框

CSS3是一种强大的网页样式语言，可以实现许多网页效果。它也可以用来设置输入框，美化页面，提高用户体验。

input[type="text"] {
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 0 10px #ccc;
  border: none;
  outline: none;
  font-size: 16px;
  color: #333;
}

input[type="submit"] {
  padding: 10px 20px;
  border-radius: 5px;
  background-color: #0099cc;
  color: #fff;
  border: none;
  outline: none;
  font-size: 16px;
  cursor: pointer;
} 

设置输入框的CSS规则如上所示。首先，我们使用选择器来选择需要设置的输入框，例如input[type="text"]。接着，我们使用box-shadow属性来为输入框添加阴影效果，使用border-radius属性来设置边框的圆角，使用padding属性来设置内边距。我们还可以为输入框添加颜色、字体大小等样式。

如果我们需要设置提交按钮的样式，可以使用类似的规则。我们可以使用背景颜色、颜色、边框等属性，来美化按钮。还可以使用cursor属性来设置鼠标悬停时的形态。

在使用CSS3设置输入框时，我们需要注意兼容性问题。有些老旧的浏览器可能不支持某些CSS3属性。因此，我们需要使用浏览器前缀（例如-webkit-、-moz-等）来增加兼容性。同时，我们需要进行多浏览器测试，以确保样式可以在各种浏览器中正常显示。