Перейти к содержанию
cloudrc

Изменение цвета первого слова в heading

Рекомендуемые сообщения

Доброго времени суток!

Необходимо в каждом box-heading первое слово сделать другим цветом.

Получится ли это сделать посредством Css(по принципу :first-letter)?

Или если можно только с помощью JS, то буду признателен за подсказку.

Заранее спасибо!

Пример: th-ecra-ter.ru (без тире)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

гуглить css первое слово другим цветом и выбирать подходящий вариант

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Нашел вариант с JS

Но при использовании скрипта все заголовки, которым задаю необходимый класс, становятся одинаковыми, включая названия, т.е. по сути "склеиваются".

Код:

<script>
$(function(){
var a = new String;
a = $('.text_cont_inner').html();
var b = a.indexOf(' '); 
if (b == -1) {
b = a.length;
}
$('.text_cont_inner').html('<span class="first_word">'+a.substring(0, b)+'</span>'+a.substring(b, a.length));
});
</script>

Кто подскажет решения проблемы?

С JS почти незнаком, предложили использовать массив:

 <script>
$(function(){
var a = [], len, i, b =  [];
len = $('.text_cont_inner').length;
for (i = 0; i < len; i++) {
a[i] = $('.text_cont_inner')[i].html();
b[i] = a[i].indexOf(' '); 
if (b[i] == -1) {
b[i] = a[i].length;
}
$('.text_cont_inner')[i].html('<span class="first_word">'+a[i].substring(0, b[i])+'</span>'+a[i].substring(b[i], a[i].length));
}
});
</script>

Но при использовании массивов, первое слово в заголовках не меняется.(Возможно, я просто не понял принцип массивов и как их использовать).

Буду благодарен за помощь!

Изменено пользователем cloudrc

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.