как отменить каскадирование или наследование

@ninja2 · Регистрация: 26.09.2012

Author24 — интернет-сервис помощи студентам

Привет!
Создал плагин для вордпресс и вывожу таблицу через шорткод в клиентской части, к таблице применяю класс свой и ему задаю стили и эти стили не работаю их перекрывают стили самой темы.
Как сделать чтобы например было блок <div class="my"><table>....</table></div>, чтобы в блоке <div> любой html не наследувал стили от других классов.
Нада такой стиль написать чтобы отображалась таблица одинаково во всех темах, а не так что от каждой темы стили перекрывают все мои стили
Я использовал !important тогда работает свойство мое, а если в теме будут куча свойств что в моем стиле не определены, мне что нужно все стили что есть определять и ставить !important чтобы не перекрывались? Как правильно сделать и отменить каскадирование или как оно называется наследование?

Добавлено через 40 минут
от есть класс который в теме вордпресс

CSS    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
.entry-content th, .comment-content th {
    font-weight: 700;
    padding: 8px;
    text-transform: uppercase;
}

и от стиль который я создал

CSS    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
8
9
.tab th{
    /*all:unset;*/
    /*!important;*/
    border:0px;
    background: #34495E;
    color: #ecf0f1;
    padding: 20px;
    font-size:16px;
}

от это text-transform: uppercase; у меня появляется и весь текст большими буквами пишется, как сделать чтобы стили не наследовались? Щас это наследуется в одной теме, в другой еще какое то свойство наследоваться будет. Как убрать это text-transform: uppercase?

Вот консоль, мой падинг перечеркнутый, и добавился левый текст большими символами:

как отменить каскадирование или наследование

Понял как padding сделать чтобы мой применился, нужно повысить специфичность.
В моем стиле и в стиле из темы получается одинаковая специфичность по 11
Определил класс по другому table.one th и тут уже 12 и padding применился.
Как отменить text-transform: uppercase; и все другие возможные стили которые могут быть в других темах?

@boilzzz · 26.05.2016, 08:21

(Тут был урл на !importent)Упс не заметил, делай как я пиши сайты без cms. А так я думаю да придётся каждому стилю, либо постораться повысить приоретет стиля

@mrtoxas · 26.05.2016, 09:45

Сложно так сказать, не видя всей картины. text-transform: uppercase убирается стилем text-transform: none. Можно попытаться так написать:

CSS    
        
    Скопировано
1
2
3
.my th{
text-transform: none !important;
}

Или изменить стили в самом шаблоне.
А сайт уже в интернете?

@ninja2 · 26.05.2016, 10:00 **[ТС]**

Сообщение от mrtoxas

А сайт уже в интернете?

Нет, это просто тренируюсь стили делать.

От наследование в css похоже нельзя отменить, а для того чтобы классы без !importent применялись нужно приоритет повышать можно два класса назначить таблице и так прописать .tab.one th и приоритет уже 21 выше.
Или один класс и так table.one th, или от так по одному классу каждому table.tab th.tab-th так еще выше 22.

А как лучше приоритеты повышать по нормальному?

@mrtoxas · 26.05.2016, 10:09

Есть же табличка. По ней сидеть и играться.

* {} /* a=0 b=0 c=0 -> специфичность = 0 */
li {} /* a=0 b=0 c=1 -> специфичность = 1 */
li:first-line {} /* a=0 b=0 c=2 -> специфичность = 2 */
ul li {} /* a=0 b=0 c=2 -> специфичность = 2 */
ul ol+li {} /* a=0 b=0 c=3 -> специфичность = 3 */
ul li.red {} /* a=0 b=1 c=2 -> специфичность = 12 */
li.red.level {} /* a=0 b=2 c=1 -> специфичность = 21 */
#t34 {} /* a=1 b=0 c=0 -> специфичность = 100 */
#content #wrap {} /* a=2 b=0 c=0 -> специфичность = 200 */

А еще можно подумать не только о том, как повысить специфичность своих стилей, а еще заодно - как понизить ее для родных

@ninja2 · 26.05.2016, 10:59 **[ТС]**

Сообщение от mrtoxas

li:first-line {} /* a=0 b=0 c=2 -> специфичность = 2 */

Сдесь не правильно, для псевдокласов специфичность 10, значит тут 11 общая

Добавлено через 15 минут
а не это псевдоэлемент за него +1

тут способ придумал как перекрыть все классы, создать див и ему два класса присвоить <div class="hight priority">
и дальше таблицу определять без всяких заморочек hight.priority table{} и hight.priority td{} и остальные вроде получается стили не замороченые и всегда наш будет перекрывать без !important

@mrtoxas · 26.05.2016, 11:11

Сообщение от ninja2

Здесь не правильно

Все здесь правильно. :first-line это псевдоэлемент, а не псевдокласс.

Добавлено через 6 минут
Можно вообще убрать из родных стилей uppercase и использовать его там, где это конкретно нужно, но почему-то мне кажется, что это будет крайне редко

@Htext · 26.05.2016, 20:00

Сообщение от ninja2

как сделать чтобы стили не наследовались?

Вроде бы, стандартный метод: присвоить свойству значение "auto". При этом значение должно сброситься.

Новые блоги и статьи Все статьи Все блоги /
std::vector в C++: от основ к оптимизации производительности NullReferenced 06.04.2025 Для многих программистов знакомство с std::vector происходит на ранних этапах изучения языка, но между базовым пониманием и подлинным мастерством лежит огромная дистанция. Контейнер std::vector. . .	Реляционная модель и правила Кодда: фундамент современных баз данных Codd 05.04.2025 Конец 1960-х — начало 1970-х годов был периодом глубоких трансформаций в области хранения и обработки данных. На фоне растущих потребностей бизнеса и правительственных структур существовавшие на тот. . .	Асинхронные операции в Django с Celery py-thonny 05.04.2025 Разработчики Django часто сталкиваются с проблемой, когда пользователь нажимает кнопку отправки формы и. . . ждёт. Секунды растягиваются в минуты, терпение иссякает, а интерфейс приложения замирает. . . .	Использование кэшей CPU: Максимальная производительность в Go golander 05.04.2025 Разработчикам хорошо известно, что эффективность кода зависит не только от алгоритмов и структур данных, но и от того, насколько удачно программа взаимодействует с железом. Среди множества факторов,. . .	Создаем Telegram бот на TypeScript с grammY run.dev 05.04.2025 Одна из его самых сильных сторон Telegram — это интеграция ботов прямо в экосистему приложения. В отличие от многих других платформ, он предоставляет разработчикам мощный API, позволяющий создавать. . .
Паттерны распределённых транзакций в Event-Driven микросервисах ArchitectMsa 05.04.2025 Современные программные системы всё чаще проектируются как совокупность взаимодействующих микросервисов. И хотя такой подход даёт множество преимуществ — масштабируемость, гибкость, устойчивость к. . .	Работа с объемным DOM в javascript Htext 04.04.2025 Сегодня прочитал статью тут о расходах памяти в JS, ее утечках и т. п. И вот что вспомнил из своей недавней практики. Может, кому пригодится. Хотя, в той статье об этом тоже есть. Дело в том, что я. . .	Оптимизация производительности Node.js с помощью кластеризации run.dev 04.04.2025 Масштабирование приложений для обработки тысяч и миллионов запросов — обыденная задача для многих команд. Node. js, благодаря своей асинхронной событийно-ориентированной архитектуре, стал популярной. . .	Управление зависимостями в Python с Poetry py-thonny 04.04.2025 Стандартный инструмент для установки пакетов в Python - pip - прекрасно справляется с базовыми сценариями: установил пакет командой pip install и используешь его. Но что произойдёт, когда разные. . .	Мониторинг с Prometheus в PHP Jason-Webb 04.04.2025 Prometheus выделяется среди других систем мониторинга своим подходом к сбору и хранению метрик. В отличие от New Relic, который использует агентный подход и отправляет данные во внешнее хранилище,. . .

@boilzzz Богатый духовно 455 / 262 / 145 Регистрация: 10.03.2015 Сообщений: 1,057
	26.05.2016, 08:21
	(Тут был урл на !importent)Упс не заметил, делай как я пиши сайты без cms. А так я думаю да придётся каждому стилю, либо постораться повысить приоретет стиля 0

@ninja2 979 / 196 / 33 Регистрация: 26.09.2012 Сообщений: 2,041
	26.05.2016, 10:00 [ТС]
	Сообщение от mrtoxas А сайт уже в интернете? Нет, это просто тренируюсь стили делать. От наследование в css похоже нельзя отменить, а для того чтобы классы без !importent применялись нужно приоритет повышать можно два класса назначить таблице и так прописать .tab.one th и приоритет уже 21 выше. Или один класс и так table.one th, или от так по одному классу каждому table.tab th.tab-th так еще выше 22. А как лучше приоритеты повышать по нормальному? 0

@mrtoxas 3827 / 2677 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	26.05.2016, 10:09
	Есть же табличка. По ней сидеть и играться. * {} /* a=0 b=0 c=0 -> специфичность = 0 / li {} / a=0 b=0 c=1 -> специфичность = 1 / li:first-line {} / a=0 b=0 c=2 -> специфичность = 2 / ul li {} / a=0 b=0 c=2 -> специфичность = 2 / ul ol+li {} / a=0 b=0 c=3 -> специфичность = 3 / ul li.red {} / a=0 b=1 c=2 -> специфичность = 12 / li.red.level {} / a=0 b=2 c=1 -> специфичность = 21 / #t34 {} / a=1 b=0 c=0 -> специфичность = 100 / #content #wrap {} / a=2 b=0 c=0 -> специфичность = 200 */ А еще можно подумать не только о том, как повысить специфичность своих стилей, а еще заодно - как понизить ее для родных 0

@ninja2 979 / 196 / 33 Регистрация: 26.09.2012 Сообщений: 2,041
	26.05.2016, 10:59 [ТС]
	Сообщение от mrtoxas li:first-line {} /* a=0 b=0 c=2 -> специфичность = 2 / Сдесь не правильно, для псевдокласов специфичность 10, значит тут 11 общая Добавлено через 15 минут* а не это псевдоэлемент за него +1 тут способ придумал как перекрыть все классы, создать див и ему два класса присвоить <div class="hight priority"> и дальше таблицу определять без всяких заморочек hight.priority table{} и hight.priority td{} и остальные вроде получается стили не замороченые и всегда наш будет перекрывать без !important 0

@mrtoxas 3827 / 2677 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	26.05.2016, 11:11
	Сообщение от ninja2 Здесь не правильно Все здесь правильно. :first-line это псевдоэлемент, а не псевдокласс. Добавлено через 6 минут Можно вообще убрать из родных стилей uppercase и использовать его там, где это конкретно нужно, но почему-то мне кажется, что это будет крайне редко 0

@Htext 361 / 121 / 21 Регистрация: 08.01.2015 Сообщений: 1,382 Записей в блоге: 2
	26.05.2016, 20:00
	Сообщение от ninja2 как сделать чтобы стили не наследовались? Вроде бы, стандартный метод: присвоить свойству значение "auto". При этом значение должно сброситься. 0