У меня есть веб-сайт со страницей продукта, который нужно изменения: http://weardenali.com/product/everyday-messengerWooCommerce - Как удалить DIV тень и изменить цвет фона
Я пытаюсь
а) Изменение цвета фона
b) Снимите теневой блок
Он работает на iPad (высота 768 пикселей), но как только высота сайта уменьшается ниже 768 пикселей, функция салфетки перестает работать.
Я надеюсь, что кто-то может помочь мне в этом.
Это изображение моего сайта here
Чтобы ответить на ваши вопросы в порядке:
а) фон вашей страницы задается как стиль элемента. Вероятно, из стиля WordPress или любой другой причины, которую я не могу сразу определить. Корневой элемент стилируется .product-main в файле sf-combined.min CSS. Здесь вы можете установить цвет фона на все, что вы хотите, как это было предложено:
.product-main {
background-color: #anything;
}
Учитывая это может или не может работать, я предлагаю вам попытаться определить, почему .product-главный элемент имеет стиль #fcfcfc , Следующие не рекомендуется, но вы всегда можете установить .product-main {background-color: #anything! Important; } для отмены любых настроек. Но это не лучшая практика.
б) в вашем CSS в НФ-combined.min.css по линии 15 (которая может быть неточной, потому что это уменьшенная CSS документ) есть следующие строки:
.product-ФВ-сплит Див. продукт div.summary.
Удалите записи окно тень от CSS:
.product-fw-split div.product div.summary {
padding: 40px;
margin-bottom: 40px;
-moz-box-shadow: 1px 1px 1px rgba(0,0,0,.1);
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1);
box-shadow: 1px 1px 1px rgba(0,0,0,.1);
}
И коробка тень должна исчезнуть. Пожалуйста, проверяйте любые ответные запросы, которые могут повлиять на то же самое на мобильных устройствах (которые я не проверял).
c) Я не мог полностью определить, что ваш вопрос был в c. Я считаю, что вы хотите знать, как предотвратить функционирование салфетки от остановки работы при изменении размера на устройствах размером меньше 768 пикселей? Это может быть функциональность WooThumbs, и в этом случае я предлагаю вам обратиться к поддержке CodeCanyons и попытаться получить ответ напрямую от них. https://codecanyon.net/item/woothumbs-awesome-product-imagery/2867927
Надеюсь, это поможет. В следующий раз вам будет проще разделить вопросы на несколько вопросов, чтобы другие могли легче находить ответы.
Внесите свои изменения: A) изменить product-main clearfix стиль background-color: #fcfcfc; желаемый цвет.
B) Удалить
Remove /* -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1); */
Remove /* box-shadow: 1px 1px 1px rgba(0,0,0,.1);`
из вашего класса summary или переименовать DIV.
C) Я просто тестирую его в хромовой версии 55 ........ имитирует iphone 5 и yurur carousel, все еще работающий.
Благодарим за помощь. Все ваши предложения сработали, и с) я бы посоветовался с Woothumbs –
Рад, что это помогло! Если вы найдете ответ от WooThumbs, вы можете отредактировать исходный вопрос, чтобы добавить ответ, который вы нашли, для дальнейшего использования! – Extricate