2013-07-03 3 views
1

Я разрабатываю веб-сайт, который будет содержать две страницы для отзывов. Первые две рекомендации будут отображаться на главной странице, затем остальные три отзыва будут отображаться на исходной странице отзывов.изменение цвета того же div, когда на другой странице

Оригинальная страница справочного справочника цвет фона отличается от исходной. Я хочу изменить цвет текста на странице отзывов. Я хочу знать, можно ли изменить стиль одного и того же div, но на другой странице, используя атрибуты и селектора CSS?

Это класс, который я хочу, чтобы стиль по-другому не на главную страницу, а на оригинальной странице .testimonial

.testimonial-author { 
color: #14C2E7; 
font-family: 'lobster_1.4regular'; 
font-size: 35pt; 
height: auto; 
line-height: 0; 
position: absolute; 
text-shadow: 1px 1px #000000; 
width: 850px; 
} 

Я попытался использовать метод ниже:

.other-pages-background, .testimonial-author{ 
color: red !important; 

}

, но он изменяется на всех страницах.

спасибо

+0

Вы используете какие-либо cms или это статические html-страницы? вы можете опубликовать ссылку на свою страницу –

+1

im с помощью wordpress с плагином отзывов, который я написал в стиле –

ответ

1

Comma означает, что оба селекторы получить тот же стиль. Попробуйте без запятой, чтобы объединить их:

.other-pages-background .testimonial-author{ 
    color: red !important; 
} 

UPDATE:

Поскольку вы используете Wordpress, то вы можете использовать следующие с соответствующей страницы ID:

body.page-id-111 { 
    color: red !important; 
} 
1

При загрузке страницы задать PHP, чтобы написать в голове ПОСЛЕ Css нагрузки

<script> 
.testimonial-author { 
color: #color;} 
</script> 
1

Существуют различные способы для достижения этой цели.

Включите дополнительный файл css, скажем, homepage.css на домашней странице вместе с testimonials.css, который будет содержать css, чтобы переопределить цвет по умолчанию.

.testimonial-author { 
    color: $HOMEPAGE_COLOR; 
} 

Добавьте тело класса тега вашей домашней страницы и перезаписать свойство CSS, как показано ниже.

HTML

<body class="homepage"> 

CSS

/* Will be applied in Testimonial page */ 
.testimonial-author { 
color: #14C2E7; 
font-family: 'lobster_1.4regular'; 
font-size: 35pt; 
height: auto; 
line-height: 0; 
position: absolute; 
text-shadow: 1px 1px #000000; 
width: 850px; 
} 

/* Will be applied in Homepage */ 
.homepage .testimonial-author { 
color: #14C2E7; 
} 

Я предпочитаю более поздние варианты.

2

Возможно, вам лучше было бы обернуть ваши отзывы на домашней странице в другом div, чтобы вы могли использовать свой CSS, чтобы ориентировать отзывы на главной странице, не создавая самой страницы отзывов.

Например, на вашей домашней странице, вы могли бы

<div class="homepage-testimonials"> 
    <div class="testimonials"> 
     <div class="testimonial-author">John Doe</div> 
    </div> 
</div> 

Ваш CSS;

.homepage-testimonials .testimonial-author { color: red; } 
+0

@Arthur вместо домашней страницы. Вы также можете использовать идентификатор тега тела и/или класс, специфичный для этих страниц. – gnanz

+0

Да, это также сработает. Однако, если на этой странице есть какие-либо другие div с теми же именами классов, которые не должны быть разными, тогда это не сработает. Хотя это, вероятно, никогда не будет вероятным. –

Смежные вопросы