ホームページ > ウェブフロントエンド > CSSチュートリアル > Safari で入力要素の丸めを無効にする方法

Safari で入力要素の丸めを無効にする方法

DDD
リリース: 2024-10-30 17:56:31
オリジナル
640 人が閲覧しました

How to Disable Input Element Rounding in Safari?

Safari で入力要素の丸めを無効にする

iPhone および Safari ブラウザ用の Web サイトを開発する場合、テキスト入力フィールドに表示される問題が発生する場合があります。 Web サイト全体のデザインと競合する、気が散るような丸みを帯びた外観です。

この問題を修正し、入力フィールドを意図した長方形としてレンダリングするには、次の CSS コードを使用して Safari に指示します:

<code class="css">input {
  border-radius: 0;
}</code>
ログイン後にコピー

検索目的に指定された入力フィールドの場合は、次の追加 CSS を使用します。

<code class="css">input[type="search"] {
  -webkit-appearance: none;
}</code>
ログイン後にコピー

iOS デバイスに対する丸めの削除を分離する必要がある場合は、-webkit-border-radius: 0; を使用します。財産。ただし、Apple は将来、接頭辞付きプロパティのサポートを中止する可能性があることに注意してください。

iOS の古いバージョンの場合は、-webkit-Appearance: none を使用してください。代わりに:

<code class="css">input {
    -webkit-appearance: none;
}</code>
ログイン後にコピー

以上がSafari で入力要素の丸めを無効にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート