모바일 페이지의 기본 스타일을 재설정하는 방법은 무엇입니까? 방법은 무엇입니까

모바일 페이지의 기본 스타일을 재설정하는 방법은 무엇인가요? 이제 막 모바일 페이지를 접하게 된 많은 친구들이 이런 질문을 할 거라 믿습니다. 이 장에서는 모바일 페이지의 기본 스타일을 재설정하는 방법을 소개합니다. 방법은 무엇입니까? 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

1, -webkit-tap-highlight-color

-webkit-tap-highlight-color:rgba(0,0,0,0) //투명도 설정 링크 및 텍스트 상자 개체를 클릭할 때 기본 회색 반투명 ​​오버레이(iOS) 또는 가상 프레임(Android)을 제거하려면 0으로 설정합니다.

-webkit-tap-highlight-color:rgba(255,0,0,0.5); //Works에서만 링크 영역 강조 표시를 터치 시 50% 투명 빨간색으로 설정하려면 이 속성을 사용합니다. iOS에서. 이 속성이 Android에서 사용되는 한 테두리로 표시됩니다. 본문의 클릭 영역이 동일한 효과를 갖도록 하려면 이 속성을 본문에 추가하세요.

2.outline: none

(1) PC에서 a 태그에 대해 이 스타일을 정의하는 목적은 a 태그를 클릭할 때 나타나는 점선을 없애기 위한 것입니다. IE 브라우저에서. IE7 이하 브라우저는 아직 이 속성을 인식하지 못합니다. Chrome에서 기본 텍스트 상자 포커스 스타일을 취소하려면 hidefocus="true"

(2) input, textarea{outline:none}을 추가해야 합니다.

(3) 텍스트 상자의 기본 스타일을 제거하려면 -webkit-appearance를 사용하여 기본 스타일을 취소할 수 있습니다. 초점을 맞출 때 -webkit-tap-highlight-color . 이 속성을 추가하는 일부 모바일 재설정 파일을 보았지만 실제로는 중복됩니다.

3.-webkit-appearance

-webkit-appearance: none;//iOS의 버튼에 이 속성을 추가합니다. 입력 상자 사용자 정의 스타일

이 속성을 사용한 후에는 다양한 유형의 입력이 다르게 동작합니다. 텍스트와 버튼에 스타일이 없으며 라디오와 체크박스가 바로 사라집니다.

4.-webkit-user-select

-webkit-user-select: none; // 페이지 텍스트 비활성화; Selection , 이 속성은 상속되지 않으며 일반적으로 본문 전체의 텍스트가 자동으로 조정되지 않도록 규정하기 위해 본문에 추가됩니다

5.-webkit-text-size-adjust#🎜🎜 #

-webkit- text-size-adjust: none; //자동 텍스트 조정을 비활성화합니다(기본적으로 장치를 회전할 때 텍스트 크기가 변경됨). 일반적으로 이 속성은 상속되지 않습니다. 본문 전체의 텍스트가 자동으로 조정되지 않도록 규정합니다. 조정

6.-webkit-touch-callout

-webkit-touch-callout:none; // 페이지를 길게 누를 때 팝업 메뉴를 비활성화합니다(iOS에서 유효). img와 태그 모두

7.-webkit-overflow-scrolling

#🎜로 추가해야 합니다. 🎜#-webkit-overflow-scrolling:touch; // 부분 스크롤(iOS 5 이상에서만 지원)

위는 모바일 페이지의 기본 스타일을 재설정하는 방법입니다. 모든 방법을 소개합니다.

HTML 동영상 튜토리얼

에 대해 자세히 알고 싶다면 PHP 중국어 웹사이트를 주목하세요.

위 내용은 모바일 페이지의 기본 스타일을 재설정하는 방법은 무엇입니까? 방법은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!