CSS - не может переопределить P.class из-за * определения - PullRequest
Новая
       7

CSS - не может переопределить P.class из-за * определения

2 голосов
/ 11 декабря 2011

У меня есть сайт, использующий 2 CSS: один глобальный, один для конкретной страницы.
По умолчанию я хочу установить тип и размер шрифта для всего и настроить его в зависимости от моих потребностей на некоторых страницах.

Итак, у меня есть:

global.css 

* {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

html {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0px;
}

p {
    text-align:justify;
    margin:0px;
    margin-bottom:10px;
}

a:link {
    color: #993300;
    text-decoration: none;
}

a:visited {
    color:#993300;
    text-decoration: none;
}

a:hover {
    color: #FF0000;
    text-decoration: underline overline;
}

news.css 

div.news{
    width: 100%;
}

.news p.reminder {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #848484;
    margin:0px;
    margin-bottom:20px;
    text-align: center;
    position: relative;
    top: -10px;
    text-transform: uppercase;
}
.news p.reminder a:link, .news p.reminder a:visited {
    color: #848484;
}
.news p.reminder a:hover {
}

HTML-файл 

       <HTML>
          <HEAD>
             <TITLE>the title</TITLE>

              <LINK href="global.css" rel="stylesheet" type="text/css">
              <LINK href="news.css" rel="stylesheet" type="text/css">
           </HEAD>
           <BODY>
              <DIV class="news"> 
                    <P class="reminder"> 
                        <A href="some_url">some text</A> 
                    </P>
                </DIV>
            </BODY>
        </HTML>

По какой-то причине, которую я не вижу, часть: 

.news p.reminder {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;

не учитывается.
Если удалить* определение из global.css, все в порядке.Но если я сохраню это, эта часть не переопределит его.

Как мне сделать, чтобы это сработало?

1 Ответ

6 голосов
/ 11 декабря 2011

Причина, по которой вы этого не видите, заключается в том, что, хотя абзац принимает выбранные вами стили, селектор * соответствует <A href="some_url"> и быстро возвращает их обратно.

Вы также можете изменить селектор, чтобы он соответствовал элементу a, но я бы установил стиль шрифта для body вместо *

...