改变input里面的东西为啥图标没有变化

form {
  width: 300px;
  padding: 10px;
  border: 3px dashed #567;
  margin: 50px auto;
}
form > div {
  margin-bottom: 10px;
}
input[type="text"]{
  border: 3px dotted orange;
  padding: 10px;
  background: #fff;
  border-radius: 30px 0;
 text-shadow: 2px 2px 0 red;
 box-shadow:4px 4px 4px green,5px 5px 5px purple inset;
}
input[type="text"]:-moz-read-only{
  border-color:#CCC;
}
input[type="text"]:read-only{
  border-color: #ccc;
}
input[type="text"]:-moz-read-write{
  border:2px solid red;
}
input[type="text"]:read-write{
  border:2px solid red;
}