Поиск требуемых CSS стилей

Владислав Белецкий
Владислав Белецкий .
Категория:
Комментариев: 0

В этой статье мы немного отойдем от рассмотрения WordPress тем и коснемся поиска необходимых CSS стилей. Очень часто можно столкнуться с тем, что вам требуется изменить некоторые части шаблона или разметки. К примеру, вы хотите убрать границу между сайдбаром и остальной частью страницы. Как найти стили, отвечающие за описание границы?
В этом случае вам придется включить внимательность. Вы знаете, что вам требуется сделать, но не представляете себе, как найти нужное стилевое правило, отвечающее за лишнюю границу.
Самое простое решение — тщательно исследовать исходный код страницы веб-сайта. Сделать это можно следующим способом: открываем свой браузер и выбираем в нем настройку VIEW > PAGE SOURCE (или VIEW > SOURCE). Для активации поиска используйте сочетание клавиш Ctrl+F. Теперь у вас возникнет вопрос: что искать? Раз граница находится у сайдбара, значит, нам нужно найти его идентификатор. Для этого достаточно взять любой заголовок, который находится в сайдбаре. Этот заголовок мы и будем искать.
Введите заголовок в строку поиска и нажмите «Find». Если вы не использовали эту фразу в своих записях, то первое же ее вхождение укажет вам на сайдбар. В противном случае вам нужно будет еще раз щелкнуть по кнопке «Find». Делайте это до тех пор, пока не отыщите требуемую фразу в необходимой области.
Если вы используете Internet Explorer, то вы можете воспользоваться специальным инструментом — Internet Explorer Developer Toolbar, который позволит вам визуально увидеть и выбрать элементы, идентификаторы и классы на странице. Все элементы выводятся в иерархической структуре. Вы всегда можете скачать Internet Explorer Developer Toolbar со страницы Microsoft.
Как только вы найдете требуемую фразу, вам останется лишь отыскать в коде слова, связанные с сайдбаром — sidebar, menu или sidecolumn:

<div id="sidebar">
или
<div class="sidebar">

В примере приведена секция, отвечающая за сайдбар. Теперь нам необходимо открыть файл style.css и отыскать в нем правила следующего вида:

#sidebar
или
.sidebar

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

#sidebar {position: relative; float: right; width: 170px;
    color: blue; font-size: 90%; border-right: solid 1px blue; } 

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

Источник: http://codex.wordpress.org/Finding_Your_CSS_Styles

Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии