2009-05-13 4 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;} 

шрифт наследуется в Mozilla, но IE7 держит Courier внутри текстового поля.

UPD: По-видимому inherit не работает в IE для textarea, поэтому я пойду с помощью метода AlbertoPL.

+0

Странно, что Mozilla «работает», когда я искал эту ошибку, когда она этого не сделала (FF 4). У моего 'body' есть объявление шрифта, но' textarea' был в курьерах. Указание моего деления шрифта как 'body, textarea {...' отлично работало. – Stephen

+0

... еще лучше, я действительно прочитал вопрос и установил 'textarea {font: inherit}', который также хорошо работает;). – Stephen

ответ

25

Просто создайте элемент textarea и определите там свой элемент шрифта.

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

Вы можете перемещать его из элемента кузова.

Вы должны будете определить шрифт дважды (один раз в теле и один раз в текстовом поле), если вы не хотите использовать *.

+0

Это будет работать, но, по-видимому, существует довольно много накладных расходов, связанных с применением стиля ко всему с помощью * – da5id

+0

Определение шрифта дважды также будет работать, но почему шрифт не будет: наследовать работу? Как я уже сказал, я не могу проверить atm, но я на 99% уверен, что это не то, что я сделал ... – da5id

+0

Я собираюсь предположить, что IE7 просто не наследует правильно, что является позором. – AlbertoPL