iPhone/Safari에서 둥근 입력 요소를 비활성화하려면 어떻게 해야 합니까?

iPhone/Safari에서 둥근 입력 요소 비활성화

iOS 기기의 Safari는 텍스트 입력 필드를 둥근 스타일로 렌더링하는 경향이 있습니다. 항상 의도한 디자인과 일치하도록 하세요. 이 문제를 해결하기 위해 입력 필드를 둥글게 하지 않고 직사각형으로 렌더링하지 않도록 Safari에 지시하는 방법은 다음과 같습니다.

iOS 5 이상:

1. CSS 스타일:

CSS 규칙 사용 border-radius: 0; 모든 입력 필드의 둥근 모서리를 제거합니다.

2. WebKit 모양:

구체적으로 검색 입력 필드의 경우 -webkit-appearance 속성을 없음으로 설정하세요.

<code class="css">input {
  border-radius: 0;
}

input[type="search"] {
  -webkit-appearance: none;
}</code>

레거시 Safari 버전의 경우:

WebKit 모양:

이전 버전의 Safari에서는 모든 입력 필드에 대해 -webkit-appearance: none 속성을 사용하여 둥근 스타일을 제거합니다.

<code class="css">input {
  -webkit-appearance: none;
}</code>

참고:

• -webkit-border-radius: 0; 속성은 iOS에서만 입력 필드를 대상으로 하는 데 사용할 수 있지만 향후 단계적으로 폐지될 수 있습니다.
• 선호되는 방법은 표준 border-radius 속성과 -webkit-을 사용하여 플랫폼 전체에서 둥근 모서리를 정규화하는 것입니다. Safari에만 나타나는 속성입니다.

위 내용은 iPhone/Safari에서 둥근 입력 요소를 비활성화하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!