web-dev-qa-db-ja.com

フォーカスされたコンテンツ編集可能なプリの周囲の境界線を削除するにはどうすればよいですか？

Pre要素をcontenteditableに設定し、その要素に編集のためのフォーカスを置くと、あまりきれいに見えない点線の境界線が周囲に表示されます。フォーカスがどこかにある場合、境界線はありません。
その境界線を削除するにはどうすればよいですか？

ありがとう

javascriptjquerycontenteditable
90
Christoffer

outline property を0px solid transparent;に設定します。 :focus状態にも設定する必要があるかもしれません。例えば：

[contenteditable]:focus {
    outline: 0px solid transparent;
}
170
Marius

:read-write疑似クラスを編集可能なスタイル要素に追加することもできます。

例えば（ jsFiddle ）：

.element:read-write:focus {
     outline: none;
}

続きを読む ここではcodrops 。

:read-write疑似クラスセレクターは、Chrome、Safari、およびOpera 14+、およびiOSでサポートされています。Firefoxの-moz-プレフィックスでサポートされています。 form :-moz-read-write。:read-writeセレクターは、Internet ExplorerおよびAndroidではサポートされていません。

11
morkro