2009-05-13 3 views
20

텍스트 영역을 웹 페이지의 다른 모든 글꼴과 동일한 글꼴로 만들려면 어떻게해야합니까?텍스트 영역의 글꼴 일관성

test.html :

<html> 
     <head> 
     <link rel="stylesheet" href="test.css"> 
     </head> 
    <body> 
     <div id="testarea"> 
      <textarea></textarea> 
     </div> 
    </body> 
    </html> 

test.css :

현재 내 코드가

body { font: 100%/120% Verdana, Arial, Helvetica, sans-serif;} 
    #testarea textarea { width: 30em;height: 7em;font: inherit;} 

글꼴 모질라에서 상속을하지만, IE7은 텍스트 영역 내부에 택배를 유지합니다.

UPD : 분명히 inherit은 IE에서 textarea로 작동하지 않으므로 AlbertoPL의 방법을 사용하겠습니다.

+0

Mozilla가 "작동"한다는 이상한 점은 내가이 버그를 찾지 못했을 때 (FF 4) 찾았 기 때문입니다. 내 body는 폰트 선언을 가지고 있지만, textarea는 택배에 있었다. 내 글꼴 delcaration을'body, textarea {...'로 지정하면 잘 동작합니다. – Stephen

+0

... 더 나은 점은 실제로 질문을 읽고'textarea {font : inherit} '을 설정하는 것입니다.). – Stephen

답변

25

텍스트 영역 요소를 만들고 거기에 글꼴 요소를 정의하기 만하면됩니다.

textarea { font: 100%/120% Verdana, Arial, Helvetica, sans-serif;} 

본문 요소 밖으로 이동할 수 있습니다.

*을 사용하지 않으려면 글꼴을 두 번 (본문에 한 번, 텍스트 영역에 한 번) 정의해야합니다.

+0

그럴 수는 있지만, * – da5id

+0

두 번 정의 글꼴을 사용하여 스타일을 적용하는 데 소요되는 상당한 오버 헤드가있을 수 있습니다.하지만 확실히 작동하지는 않지만 글꼴은 상속되지 않습니다. 내가 말했듯이, 나는 atm을 테스트 할 수는 없지만, 내가 한 일이 99 % 확신한다 ... – da5id

+0

IE7이 올바르게 상속받지 못한다고 추측 할 것이다. 그것은 수치 스럽다. – AlbertoPL