Ошибка CSS для новичков?

Question

У меня есть простой формы входа в систему, которую я субэлемент с помощью CSS, которые можно посмотреть здесь:

http://www.skoolrox.com/JSON/employee-2.html

Эта страница имеет пользовательский CSS как часть самой страницы.

Теперь у меня есть образец страницы (http://www.skoolrox.com/JSON/index.html), где у меня есть заголовок, расположение трех столбцов и нижний колонтитул. В крайнем левом столбце содержится ряд ссылок, в которых я загружаю содержимое href (в данном случае employee-2.html) в средний столбец, используя загрузку jQuery(). Он загружает страницу посередине, когда вы нажимаете ссылку «Вход».

Моя проблема заключается в том, что текст Username/Password переместился вправо и изменил форматирование. Я уверен, что на главной странице (index.html) есть CSS, который противоречит CSS-сотруднику-2.html.

Итак, мой вопрос: возможно ли при загрузке employee-2.html в средний столбец «игнорировать» внешний CSS (в index.html) или игнорировать его?

Answer 1

№. CSS предназначен для распространения «вниз» дерева DOM. В спецификациях HTML и CSS нет ничего, что позволило бы вам сказать «ничего не наследуйте». Вы должны переопределить все, что вам нужно «восстановить» позже.

например.

стили:

.outer { color: red; font-size: 150%; } 
.middle { color: blue; } 
.inner { } 

HTML:

<div class="outer"> 
    <div class="middle"> 
     <div class="inner">I wanna be red!</div> 
    </div> 
</div> 

Там нет ничего в CSS, что позволяет сказать, "игнорировать .middle стиль и использовать Космического". Вы должны сделать

.inner { color: red; }