7

角が丸いテキストエリアをサイトに追加しようとしています。

私はこのcssを使用しています：

-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;

現在、これはクロムで正しく表示されますが、textareaにフォーカスが移ると、textareaにオレンジ色の境界線が追加され、そのような境界線には丸みを帯びた角がありません。

これを修正する方法について何かアイデアはありますか？

ありがとう

4

2 に答える 2

14

デフォルトを削除してoutlineから、そのアウトラインをより...スタイルに準拠したものでエミュレートするには：

textarea {
    width: 40%;
    height: 10em;
    border-radius: 1em;
    border: 1px solid #000; /* everything up to and including this line
                               are aesthetics, adjust to taste */
    outline: none; /* removes the default outline */
    resize: none; /* prevents the user-resizing, adjust to taste */
}

textarea:focus {
    box-shadow: inset 0 0 3px 2px #f90; /* provides a more style-able
                                           replacement to the outline */
}​

JSフィドルデモ。

于 2012-05-21T23:06:50.440 に答える
0

textarea:focus{outline:none}それを見ずに答えるのはかなり難しいですが、それを行う必要があります

于 2012-05-21T23:03:47.163 に答える