Стили изменить на странице неожиданно

Question

я это CSS загружен:

#ue_email_new{ 
    border: 1px solid #000000; 
} 

Это точно отображается на странице загрузки.

Однако после нажатия на инспектировать элемент (FF 17) и просмотр CSS, я вижу эту информацию в отладчике:

element { 
    border: 1px solid rgb(221, 221, 221); 
} 

и пограничные изменения в этой странной обстановке на фактической странице.

Откуда это взялось?

Я проверил свой CSS и не могу найти эти настройки. Что такое

element 

тег, на который ссылается отладчик?

HTML выглядит следующим образом:

<div id="wr_ue_email_new"> 
    <input autocomplete="off" class="radius_all" name="email" id="ue_email_new" type="text" maxlength="320" /> 
    <p id="ue_email_lab" class="ue_lab_new">Email</p> 
</div> 

Answer 1

element ключевого слово используется для обозначения встроенных стилей для элемента. Именно поэтому он переопределяет CSS, изложенные в вашей таблице стилей.

Так в инспекторе Firefox СМЧ:

element { 
    border: 1px solid rgb(221, 221, 221); 
} 

означает, что ваши оказанные HTML заключается в следующем:

<input style="border: 1px solid rgb(221, 221, 221);" autocomplete="off" class="radius_all" name="email" id="ue_email_new" type="text" maxlength="320" /> 

Итак, сначала проверить исходный HTML, чтобы убедиться, что вы не имеете инлайн стилей, а затем проверьте, что JavaScript не добавлен в встроенный стиль.

Answer 2

Код element { .... }, который вы видите, кажется, что, возможно, Firebug сообщает о встроенных стилях текущего элемента. (Текущая версия Firefox/Firebug, что я здесь говорит element.style {...}, а не element, как и Chrome, но я до сих пор думаю, что это то, что она есть)

Я подозреваю, что вы видите, это какое-то событие Javascript запускается. Возможно событие mouseover или подобное, и это событие устанавливает границу CSS для элемента.

Когда вы используете Firebug для выбора элемента, он приостанавливает обычную обработку событий страницы, пока вы находите нужный элемент и выбираете его. Однако, как только вы выберете элемент, страница вернется в нормальное состояние, и события будут запущены.

Мое предположение, что данное событие запускается немедленно в этот момент. Код javascript для события запущен, и граница CSS установлена. Это значит, что Firebug вносит изменения в стили, но это не так; это просто код обработки событий, делающий что-то неожиданное.

Это также объясняет, почему вы не смогли найти код в своем CSS - потому что он находится в вашем JS-коде.

Я бы попробовал поиск кода JS для соответствующего цвета (как говорит @adaam, эквивалентное шестнадцатеричное значение #DDDDDD, хотя оно также может быть #DDD).