필드가 모든 브라우저의 상위 요소에서 글꼴 스타일을 상속하지 않는 이유는 무엇입니까?

필드는 모든 브라우저의 상위 요소에서 글꼴 스타일을 상속하지 않습니까? " />

필드

의 글꼴 상속 문제

HTML 문서에서 특정 요소는 상위 요소에 정의된 글꼴 ​​스타일을 상속하지 않을 수 있습니다. . 이는 특정 예에 표시된 대로 필드에서 확인할 수 있습니다.

<label class="adm" for="UserName">User name</label> <br><input class="adm" id="UserName" name="UserName" size="30" type="text" value="" />

인 경우 CSS는 요소에서 다음 양식 요소로 글꼴 계열을 상속하기 위해 적용됩니다.

body,html {font-family: Verdana,Arial,Helvetica,sans-serif; 0; 패딩:0; 색상: #111;}<br>label.adm { 글꼴 크기:0.9em; 여백:0 3px 3px; 디스플레이: 블록;}<br>input.adm em; margin:0 3px 3px;

Firefox는 이러한 요소를 다른 글꼴로 렌더링하지만 "MS Shell Dlg"라는 다른 글꼴을 표시합니다.

이러한 불일치는 요소는 모든 브라우저에서 기본적으로 글꼴 모음을 상속하지 않습니다. 상속을 명시적으로 강제하려면 CSS를 사용할 수 있습니다.

input, select, textarea, 버튼{font-family:inherit;}<br>

By 이 규칙을 통합하면 필드는 상위 에서 글꼴 모음을 상속받습니다. 요소를 사용하여 글꼴 스타일의 일관성을 보장합니다. 이 솔루션의 라이브 데모는 http://jsfiddle.net/gaby/pEedc/1/에서 확인할 수 있습니다.

위 내용은 필드가 모든 브라우저의 상위 요소에서 글꼴 스타일을 상속하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!