내 \"Input\" 요소가 \"Body\"의 글꼴을 상속하지 않는 이유는 무엇입니까?

본문에서 글꼴을 상속하지 않는 입력

CSS를 사용하여 HTML 요소의 스타일을 지정할 때 특정 요소가 스타일 속성을 상속하지 않는 경우가 있습니다. 예상대로. 이는 기본적으로 상위 요소로부터 글꼴 계열 속성을 상속하지 않는 입력 필드의 경우일 수 있습니다.

제공된 예에서 CSS 규칙은 두 요소 모두에 대해 특정 글꼴 계열을 정의하도록 설정되었습니다. 본문 요소와 사용자 정의 클래스 adm은 레이블과 입력 요소 모두에 적용됩니다. 그러나 Firefox에서는 입력 필드의 글꼴이 레이블의 글꼴과 일치하지 않습니다.

이 문제를 해결하려면 CSS를 사용하여 입력 필드가 상위 요소에서 글꼴을 상속해야 함을 명시적으로 지정할 수 있습니다.

<code class="css">input, select, textarea, button {
  font-family: inherit;
}</code>

이 규칙을 추가하면 이제 입력 필드가 body 요소에 정의된 글꼴 ​​계열 속성을 상속하여 페이지의 나머지 텍스트와 동일한 글꼴을 사용하게 됩니다.

http://jsfiddle.net/gaby/pEedc/1/ 데모를 보면 이를 확인할 수 있습니다.

위 내용은 내 \"Input\" 요소가 \"Body\"의 글꼴을 상속하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!