Проблема с использованием CSS на иконических значках в WordPress Theme.

Question

Проблема с использованием CSS на иконических значках в WordPress Theme.

Я хотел бы настроить Ionicon, используя CSS в теме последовательного WordPress. Иконических икон изначально не было в теме. Поэтому я добавил, поместив этот код в functions.php.

add_action( 'wp_enqueue_scripts', 'bg_enqueue_ionicons' );
function bg_enqueue_ionicons() {
wp_enqueue_style( 'ionicons',
'//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css', array());
}

Затем поместите этот код в footer.php. Я хотел бы поместить значок непосредственно в нижний колонтитул без использования виджетов.

 <p class="social-icons">
<a href="https://www.linkedin.com/in/isaiah/"><i class="ion-social-linkedin-outline"></i></a>
<a href="http://www.facebook.com/isaiah"><i class="icon ion-social-facebook"></i></a>
<a href="http://instagram.com/isaiah"><i class="icon ion-social-instagram-outline"></i></a>
<a href="http://dribbble.com/isaiah"><i class="icon ion-social-dribbble-outline"></i></a>
</p>

Наконец, добавив CSS, чтобы он выглядел хорошо. (Выпуск здесь)

p.social-icons {
border: 1px solid #949792;
border-radius: 50%;
color: red;
display: inline-block;
height: 42px;
margin-left: 10px;
margin-right: 10px;
padding: 10px;
width: 42px;
}

p.social-icons a:hover {
border: 1px solid #fff;
color: red;
}

Значки будут отображаться, но по какой-то причине CSS не будет применяться. У кого-нибудь есть решение для этого?

0

css html ionicons php wordpress

Решение

Другие решения

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

0

Источник

Accepted Answer

Ваш стиль должен быть таким.

 <style>
p.social-icons a{
border: 1px solid #949792;
border-radius: 50%;
color: red;
display: inline-block;
height: 42px;
margin-left: 10px;
margin-right: 10px;
padding: 10px;
width: 42px;
}

p.social-icons a:hover {
border: 1px solid #fff;
color: red;
}
</style>

0