Где найти element.style в wordpress?
Ребят всем привет, у меня такой вопрос, не могу найти где находиться в шаблоне element.style. обыскал все файлы и нигде не нашел.
Не могу понять вообще ничего, у меню есть свои стили, а он использует другие. Объясните пожалуйста кто знает.
Использую шаблон BeTheme
Заранее спасибо))
Перенос текстовой строки WordPress
Дано: WordPress с шаблоном от WooThemes. Проблем куча на самом деле. Спрошу о двух. Первая это когда добавляешь к фотографии описание и выставляешь выравнивание по середине, картинка все равно выравнивается по левому краю (выравнивание по правому работает нормально).
2. Когда вставляешь картинку с описанием (см. картинку-пример ниже) то расстояние между картинкой и текстом либо очень маленькое, либо слишком большое. Перенос строки через , <br> или <br /> не помогает. Так же удерживание клавиш Shift+Enter тоже не помогает. В стандартных шаблонах вордпресс все нормально а в этом вот так. Но использовать другой не вариант.
element.style
Подскажите пожалуйста, каким образом правится этот элемент и где он находится :
два варианта:
1. в шаблоне компонента, который был вызван.
2. в javascript относящийся к данному элементу.
Но я думаю, что 1 вариант.
| Цитата |
|---|
| sevenssura пишет: 2. в javascript относящийся к данному элементу. |
там будет что то наподобие этого. Вас интересует первая строка этого выражения. где лежит компонент будет следующий
bitrix:catalog означает путь до папки компонента
1. bitrix->templates->папка шаблона->components->catalog
если там нет то смотрим тут
2. bitrix->components->catalog
.default означает имя шаблона она же пака шаблона, которую найдете внутри указанных путей.
Думаю теперь понятно где искать.
| Цитата |
|---|
| mlr пишет: Компонент я нашел, но файла яваскрипта там нету. |
так не факт что в javа стили подставляет. посмотрите сами блоки которые задаются и стили в нем. Если в них вы не найдете описание стиля тогда и ищите скрипт javascript но он не факт что будет отдельным файлом. Как вариант сам код в компоненте или подгрузка скрипта будет. Но вы нашли сами блоки с указанными классами то есть место где они формируются для вывода?.
Не ищите джаву сразу вы не туда увлеклись, найдите именно место в коде отвечающий за вывод нужного Вам блока и уже оттуда плящите.
.style
Свойство style получает и устанавливает инлайновые стили элемента, то есть те, что записываются через HTML-атрибут style .
С помощью него можно управлять стилем элемента. Специфичность этого свойства такая же, как у атрибута style .
Как пишется
Скопировать ссылку на секцию «Как пишется» Скопировано
Чтобы получить значения инлайновых стилей с помощью свойства style , мы можем записать:
В этом случае в значение inline Styles запишется объект CSS Style Declaration , который будет содержать в себе все инлайновые стили элемента element .
Чтобы задать стили для элемента, мы можем использовать несколько способов. Либо через css Text , чтобы указать несколько свойств разом. (Тем же эффектом обладает установка стиля через set Attribute ( ) .) Либо через отдельные свойства в style . [ property Name ] .
Следующие две записи работают одинаково и устанавливают несколько стилей в одном выражении:
Следующая — устанавливает значение определённого свойства, оставляя другие значения стиля нетронутыми:
Как понять
Скопировать ссылку на секцию «Как понять» Скопировано
Свойство style — это механизм для работы со стилями на элементе. С его помощью можно управлять отображением элементов в «рантайме», то есть во время выполнения скрипта.
Этот механизм позволяет «перетирать» стили, описанные в CSS-таблицах, так как специфичность стилей в атрибуте style выше (за исключением стилей с !important ).
Чтобы указать значение конкретного CSS-свойства, мы можем использовать одноимённое отображение в style :
Обратите внимание, что имена свойств в style . [ property Name ] записываются в camelCase, в отличие от CSS-свойств, которые записываются через дефис.
Таким образом font — family превращается в font Family , а, например, background — color — в background Color .
При сомнениях в том, как правильно называется то или иное свойство, воспользуйтесь списком соответствий:
CSS-свойства в JS-нотации
| CSS | JavaScript |
|---|---|
| background | background |
| background-attachment | backgroundAttachment |
| background-color | backgroundColor |
| background-image | backgroundImage |
| background-position | backgroundPosition |
| background-repeat | backgroundRepeat |
| border | border |
| border-bottom | borderBottom |
| border-bottom-color | borderBottomColor |
| border-bottom-style | borderBottomStyle |
| border-bottom-width | borderBottomWidth |
| border-color | borderColor |
| border-left | borderLeft |
| border-left-color | borderLeftColor |
| border-left-style | borderLeftStyle |
| border-left-width | borderLeftWidth |
| border-right | borderRight |
| border-right-color | borderRightColor |
| border-right-style | borderRightStyle |
| border-right-width | borderRightWidth |
| border-style | borderStyle |
| border-top | borderTop |
| border-top-color | borderTopColor |
| border-top-style | borderTopStyle |
| border-top-width | borderTopWidth |
| border-width | borderWidth |
| clear | clear |
| clip | clip |
| color | color |
| cursor | cursor |
| display | display |
| filter | filter |
| float | cssFloat |
| font | font |
| font-family | fontFamily |
| font-size | fontSize |
| font-variant | fontVariant |
| font-weight | fontWeight |
| height | height |
| left | left |
| letter-spacing | letterSpacing |
| line-height | lineHeight |
| list-style | listStyle |
| list-style-image | listStyleImage |
| list-style-position | listStylePosition |
| list-style-type | listStyleType |
| margin | margin |
| margin-bottom | marginBottom |
| margin-left | marginLeft |
| margin-right | marginRight |
| margin-top | marginTop |
| overflow | overflow |
| padding | padding |
| padding-bottom | paddingBottom |
| padding-left | paddingLeft |
| padding-right | paddingRight |
| padding-top | paddingTop |
| page-break-after | pageBreakAfter |
| page-break-before | pageBreakBefore |
| position | position |
| stroke-dasharray | strokeDasharray |
| stroke-dashoffset | strokeDashoffset |
| stroke-width | strokeWidth |
| text-align | textAlign |
| text-decoration | textDecoration |
| text-indent | textIndent |
| text-transform | textTransform |
| top | top |
| vertical-align | verticalAlign |
| visibility | visibility |
| width | width |
На практике
Скопировать ссылку на секцию «На практике» Скопировано
Саша Беспоясов советует
Скопировать ссылку на секцию «Саша Беспоясов советует» Скопировано
В целом для управления стилями лучше использовать CSS. Можно использовать классы-модификаторы, чтобы придавать какие-то наборы стилей элементу.
Инлайновые стили имеют более высокую специфичность — их труднее переопределить, и это мешает нормальной работе со стилями элемента.
Пример. Мы пишем библиотеку, которая умеет красиво рисовать кнопки. Если мы установим цвет и размер кнопки с помощью инлайновых стилей, то пользователь библиотеки не сможет их легко поменять. Использовать такую библиотеку никто не захочет
Однако есть некоторые случаи, когда манипуляция инлайн-стилями — это ок. Например, если мы хотим управлять отображением элемента точечно, и описывать это в CSS невозможно.
Представьте, что вы хотите сделать анимацию движения точки на экране так, чтобы движение было случайным. В CSS (пока что) этого сделать нельзя, только скриптами. И вот здесь изменение инлайновых стилей как раз кстати.
Для изменения таких стилей используется свойство style .
Используйте style , чтобы изменить или получить инлайновые стили элемента.
�� Чтобы переписать стиль элемента полностью, можно использовать css Text или set Attribute .
�� Чтобы обновить значение конкретного свойства, а остальные оставить нетронутыми, используйте style . [ property Name ] :
�� Чтобы сбросить значение, присвойте ему null .
�� Численным свойствам, таким как margin , padding , border — width и другим, следует указывать не только значение, но и единицу измерения: