0

HTMLのテキスト入力フィールドと属性がありますplaceholder：

<input type="text" placeholder="Filter results...">

残念ながら、placeholder属性は機能しないようですか？Internet Explorer 9に実装されていると思いましたか？ここでデモを見ることができます：http：//jsbin.com/esiya3/5/-http : //jsbin.com/esiya3/5/edit

また、と-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#f0f0f0')";の組み合わせで問題が発生しbackground-imageます。他のすべてのブラウザ、Firefox、Opera、Safari、Chromeでは、グラデーションと背景画像が表示されます。IE 9でのみ、背景画像はありません。グラデーションを除外する必要があります。そうすれば、画像を見ることができます。しかし、私は両方を持つために何ができますか？

グラデーションを使用したデモは次のとおりです。http： //jsbin.com/esiya3/5/-http : //jsbin.com/esiya3/5/edit

グラデーションなし：http： //jsbin.com/esiya3/6/-http : //jsbin.com/esiya3/6/edit

おそらく誰かがアイデアを持っていますか？

よろしくお願いします。

4

2 に答える 2

3

グラデーションフィルターをalpaイメージローダーと組み合わせることができます。

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myimage.png')
    progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f0f0f0');

グラデーション画像の問題を解決します。

于 2011-01-27T09:05:34.950 に答える
2

background-imageにはsvgを使用できます。svgタグを使用して、グラディアントを作成し、etension .svgで保存してから、cssファイルにロードする必要があります。

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
  <linearGradient id="g">
<stop offset="0" stop-color="blue" />
<stop offset="0.3" stop-color="yellow" />
<stop offset="0.6" stop-color="orange" />
<stop offset="1" stop-color="red" />
  </linearGradient>
  <rect x="0" y="0" width="100%" height="100%" fill="url(#g)" />
</svg>

cssファイル

div{background-image: url(gradient.svg);}
于 2012-11-05T07:09:32.463 に答える