<ion-card> имеет поле по умолчанию 10 пикселей со всех сторон элемента box.Я бы хотел, чтобы вокруг этих элементов было 0px поля.
Я не могу заменить это в глобальных стилях, используя селекторы ion-card и .sc-ion-card-md-h (и уверен, что последний будет работать только тогда, когдаприменяется md / android).
Я смог выбрать некоторые другие элементы по всему миру, но большинство высокоуровневых компонентов работают таким образом, что я не могузамените их глобально ... мои стили просто не отображаются в элементе inspect для элемента <ion-card>.
Кажется, что внутри этих элементов "shadow-root" <style> есть что-то, чем я являюсьНевозможно настроить таргетинг и перезаписать стили, если я не на глубоком компонентном уровне файлов SCSS;однако мне действительно нужно, чтобы эти стили были заменены глобально, чтобы избежать необходимости копировать / вставлять CSS в каждый компонент (так как они <ion-card> буквально существуют на каждой странице моего приложения.
Например, с помощью приведенного ниже кодани мои карточки, ни фоны названий карточек не становятся красными ... и при просмотре страницы в любом месте окна стилей элементов эти стили CSS не отображаются. Но если я использую тело в качестве селектора, тело становится красным, что означает, что мои глобальные стилизагружен, и я просто не могу выбрать эти компоненты:
ion-card,
.sc-ion-card-md-h,
ion-card-title {
--background: red !important;
background-color: red !important;
}
Если я помещу эти же стили в свой home.page.scss, на котором есть сообщения, стили действительно применяются (я думаю, это потому, что я нацеливаюсь наслот внутри этой страницы.) Почему он работает только на уровне компонентов, а не на глобальном уровне?
Есть идеи о том, как правильно настроить таргетинг этих компонентов на глобальном уровне?