Dlaczego i nie brać font-family I font-size z ciała?

Dlaczego Textarea i textfield nie biorąc font-family i font-size z ciała?

Zobacz przykład na żywo tutaj http://jsbin.com/ucano4

Kod 

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>texearea font</title>
        <style type="text/css">
        body {
            font-family: Verdana, Geneva, sans-serif;
            font-size:16px
        }
        </style>
        </head>            
        <body>
        <form action="" method="get">
        <textarea name="" cols="20" rows="4"></textarea>
        <input name="" type="text" />
        </form>
        <p>some text here</p>
        </body>
        </html>

Jeśli jest to zwykłe zachowanie, to powinienem napisać w css w ten sposób. I need same style in all 

body,textarea,input  {
                font-family: Verdana, Geneva, sans-serif;
                font-size:16px
            }

A ile innych elementów w XHTML, które nie wezmą stylizacji czcionek z body {....}?

 96
xhtmlcss
Author: Jitendra Vyas, 2010-05-20
Source

4 answers

Domyślnie przeglądarki renderują większość elementów formularza (tekstowych, pól tekstowych, przycisków itp.) za pomocą kontrolek systemu operacyjnego lub kontrolek przeglądarki. Tak więc większość właściwości czcionki pochodzi z motywu, którego obecnie używa SYSTEM OPERACYJNY.

Będziesz musiał kierować Elementy formularza samodzielnie, jeśli chcesz zmienić ich styl czcionki/tekstu - powinno to być wystarczająco łatwe, wybierając je, jak to właśnie zrobiłeś.

Z tego co wiem, dotyczy to tylko elementów formy. Off the top of my head: input, button, textarea, select.

 59
Author: BoltClock,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-05-20 15:07:39

Niektóre kontrolki nie są domyślnie dziedziczone. Możesz to nadpisać, umieszczając to w swoim CSS: 

textarea {
   font-family: inherit;
   font-size: inherit;
}
 128
Author: spoulson,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-05-20 15:14:41

Wszystkie przeglądarki mają wbudowane domyślne arkusze stylów. Dlatego, gdy tworzy się Stronę bez zdefiniowanych stylów, znaczniki <h1> są duże i pogrubione, a <strong> pogrubiają tekst. Podobnie, style czcionek dla elementów <input> i <textarea> są zdefiniowane w stylach domyślnych.

Aby zobaczyć ten arkusz stylów w Firefoksie, umieść go w pasku adresu: resource://gre/res/forms.css

W każdym razie, musisz nadpisać te style, tak jak wszystkie inne style, jak w poprzednim przykładzie.

W przypadku zastanawiasz się, jakie inne style są zdefiniowane, Sprawdź pliki CSS w swoich Zasobach. Możesz uzyskać do nich dostęp poprzez powyższy adres url lub zaglądając do folderu res w katalogu Firefoksa(np: c:\program files\mozilla firefox\res). Są to te, które mogą mieć wpływ na style zwykłych stron:

  • html.css
  • formularze.css
  • dziwactwo.css
  • ua.css
 10
Author: nickf,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-05-20 15:11:56

Myślę, że chodzi mu o to, że niektóre elementy są bardziej szczegółowe niż inne w DOM, lub mają mniejszy zakres. Ponieważ obszar textarea istnieje wewnątrz ciała, każdy styl zdefiniowany dla obszaru textarea nadpisze style{} ciała. Tak więc domyślny styl tekstowy FF nadpisuje Twój styl ciała, nawet jeśli twój jest zdefiniowany później(zwykle coś nowszego będzie miało pierwszeństwo, ale nie jeśli jest w szerszym zakresie/mniej szczegółowym).

 1
Author: user1072406,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-01-23 03:07:55