web-dev-qa-db-ja.com

Safari Mobileで入力ボタンの角が丸くなるのを防ぐ

私は主題がそれをすべて言うと思います。 Iphone、iPod、またはIpadで表示すると、Webアプリケーションがあり、入力送信ボタンの角が丸くなっています。これを止める方法はありますか？

iosmobile-safari
78
Newbie Fletcher

追加する場合...

input, textarea {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
}

その後、ボタンは、他のブラウザに適用したCSSスタイルを継承します。

181
methodofaction

-webkit-appearance：noneが機能しませんでした。

これは：

input[type=submit] {
    -webkit-border-radius:0px;
}

IPhoneの背景画像のあるボタンの角が丸くなるという同じ問題がありました。

19
Roel

次のCSSを使用してみることができます。

-webkit-appearance:none;

詳細： http://trentwalton.com/2010/07/14/css-webkit-appearance/

11
dthukka

IPad 2では、次のものを使用する必要があることがわかりました。

-webkit-appearance:none;
border-radius: 0;

ボタンクラスで。

5
Daniele F.

入力サブミットtype = "image"のサイトがありました。上記のこのバリエーションにより、丸い角が修正されました。

input[type=image] {
    -webkit-border-radius:0px;
}
3
RevConcept

background: linear-gradient(color1, color2)を設定すると、Appleデバイスの過度に丸い角が取り除かれ、私が試した他のすべてのブラウザ/プラットフォームで動作することがわかりました。

0
mait