鍍金池/ 問答/HTML5  HTML/ IE下input placeholder的字體大小及顏色設置

IE下input placeholder的字體大小及顏色設置

  1. 首先IE9不支持placeholder屬性；
  2. IE10和Edge下的placeholder設置不了顏色和大??；

但是看了小米官網(wǎng)的注冊就是可以的，請問如何做到IE9+以上的placeholder兼容性

回答
編輯回答
祈歡

用label標簽偽造出placeholder，當onfocus時消失即可

2017年4月11日 00:22
編輯回答
陪妳哭

純HTML+CSS，貌似比placeholder屬性兼容還好?,雖然還不夠完美~

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style type="text/css">
    .input {
      width: 169px;
      -webkit-appearance: textfield;
      background-color: white;
      -webkit-rtl-ordering: logical;
      cursor: text;
      padding: 1px;
      border-width: 2px;
      border-style: inset;
      border-color: initial;
      border-image: initial;
      text-rendering: auto;
      color: rgb(128, 114, 114);
      letter-spacing: normal;
      word-spacing: normal;
      text-transform: none;
      text-indent: 0px;
      text-shadow: none;
      text-align: start;
      margin: 0em;
      font: 400 13.3333px Arial;
    }
    .input:empty:not(:focus)::before {
      content: attr(data-placeholder);
    }
  </style>
</head>
<body>

  <div class="input" contenteditable data-placeholder="請輸入文字"></div>

  <input type="text" placeholder="請輸入文字" />

</body>
</html>
2017年10月18日 01:06