7

CSSでtext-identプロパティを使用すると、テキスト入力領域にフォーカスすると、テキストカーソルアイコン/キャレットがインデントされて表示されます。ただし、最初の文字を入力するまでインデントされていないように見えます。唯一の回避策は、入力要素に左パディングを使用することですが、幅も設定しており、IE固有のスプレッドシートを使用してIEのパディング修正を実装する必要がないため、パディングの使用は避けたいと思います。

このバグはSafariで発生します。

私が話していることの画像については、以下を参照してください。




テキストがない場合のフォーカスでは、text-identはキャレットの位置に影響しません。

焦点に


入力を開始すると、正しくインデントされます。

入力を開始すると


入力してから入力した内容を削除すると、最初から実行したいことが表示されます（カレットをインデントします）。

入力した内容を削除した後

HTML：

<input type="text" />

CSS：

input   { text-indent: 10px; }
4

2 に答える 2

5

これは、最近解決された確認済みのWebKitバグですhttps://bugs.webkit.org/show_bug.cgi?id=82688

お使いのバージョンのSafariは、この修正を含めるには古すぎる可能性があります。

代わりにpadding-leftを使用してください。

于 2012-08-21T00:33:02.527 に答える
3 
<style>
::-webkit-input-placeholder {text-indent:10px!important;}
:-moz-placeholder { text-indent:10px!important;}
::-moz-placeholder {text-indent:10px!important;}
:-ms-input-placeholder {text-indent:10px!important;}
</style>

これにより、テキストのインデントがインデントに焦点を合わせることができます。これは、新しいバージョンのwebkit/safariで修正されたと思います。ただし、この修正は古いバージョンで役立つはずです。

ありがとう

于 2013-05-15T11:05:55.433 に答える