Как быстро узнать где находятся CSS стили сайта

 Сегодня вы узнаете как очень просто и быстро можно узнать расположение CSS стилей любого элемента вашего сайта. Наверняка с вами случалось такое, что вы хотели изменить какой-либо элемент на сайте (к примеру цвет кнопки) но не могли найти расположение CSS стилей данного элемента. Особенно это часто случается на CMS системах, типа WordPress, где множество файлов и не понятно где там CSS. Но вам и необязательно рыться в файлах (в дебрях) в поисках CSS стилей. Вам достаточно одно нажатие на кнопку и вы узнаете точное расположение CSS стиля любого элемента вашего сайта.

 Всё очень просто, зайдите на свой сайт, нажмите правой кнопкой мыши по элементу, CSS стили которого вы хотите узнать. В появившемся окне нажмите на вкладку — Просмотреть код.

 

сайт просмотр кода

 

 Далее, с правой стороны сайта у вас откроется окно с исходным кодом выбранного вами элемента. В окне Styles будут указаны CSS стили данного элемента. Рядом с CSS стилями, с правой стороны будет отображаться ссылка, URL адрес, по которому находятся данные CSS стили. Наведите курсор мыши на данную ссылку и у вас появится подсказка с полным URL адресом CSS стилей.

 

посмотреть код сайта

 

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

 

 А есть вариант ещё проще, вам даже не надо заходить в корень сайта и менять там стили. Если ваш сайт на WordPress, то установите себе один очень классный плагин — Simple Custom CSS.

 

плагин CSS WordPress

 

 Скопируйте CSS стили из окна просмотра кода и вставьте их на страницу плагина, измените стили так как вам надо и сохраните настройки.

 

Custom CSS

 

 Зайдите на сайт, элемент стили которого вы меняли, автоматически изменится.

 

изменить стиль

 

 Вот и всё, всё очень просто, удачи вам !

 

Как быстро узнать где находятся CSS стили сайта обновлено: Июль 20, 2016 автором: Илья Журавлёв
 
 

1 Комментарии

  • Любовь 02.12.2016 Ответить

    Привет, Илья!)
    Вот это код сделать страницу сайта прозрачной:
    #content {
    background-color: #ffffff;
    opacity:0.8;
    padding-right:50px;margin-top:40px; text-align: justify; border-right: 1px solid #e3e3e3;}

    На прозрачной странице и текст и фото тоже теряют насыщенность цвета.
    Ты знаешь как это исключить? Как оставить фото не прозрачными?
    Спасибо)

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *


1 + 6 =



super-infa-top
Стрелка вверх