[CSS] wskazywanie jedynie obowiązującego selektora Opcje

[stellatus]

Czy jest w CSS takie polecenie, które wskazuje, że dany selektor jest jedynie obowiązujący, a wszystkie pozostałe o tej samej nazwie mają być ignorowane? Chodzi mi o coś w stylu:

Kod

blockquote::before [b][u]!!!ONLY THIS IS VALID[/u][/b] {
    display: inline;
    width: 1em;
    margin: 0 auto;
    position: initial;
    z-index: -1;
    left: 0;
    right: 0;

Czyli, jeżeli istnieją jeszcze inne selektory o tej samej nazwie i zwierają one inne atrybuty, to te atrybuty też mają być zignorowane, np.:

Kod

blockquote::before {
    left: 5;
    right: 5;
    top: 20px;
    font: 40px;
    cursor: default;
    vertical-align: bottom;
    content: "\e056";

Ten selektor nie byłby wskazany jako obowiązujący, więc wszystkie jego wartości byłyby skreślone.

Jest coś takiego możliwe w CSS?

[nospor]

Moze chodzi ci o
!important
?

Nie mniej jednak powinienies lepiej/dokladniej definiowac selectory by uniknac takich problemow

[stellatus]

A da się za pomocą !important wskazać selektor?

Potrzebuję tego do WordPressa. Nie chcę mieć takiego CSS dla <blockquote> jaki narzucili mi autorzy szablonu i chciałbym po prostu wskazać swój CSS dla tego elementu jako jedynie obowiązujący. Skasować ich CSS z oryginalnego pliku nie mogę, bo każda aktualizacja szablonu może skasować wprowadzone przeze mnie zmiany.


Edit:
Nie da się: https://stackoverflow.com/questions/4327321...-class-selector

Ten post edytował stellatus 22.04.2020, 12:36:01

[nospor]

To jak mowilem, okresl swoja dokladniejsza sciezke do blockquote, bo zakladam ze one i tak leza w jakims divie

twojdiv blockquote::before {

Selektory z wieksza dokladnoscia maja pierwszenstwo

[trueblue]

A w jakim momencie doczytywany jest Twój plik styli, przed czy za tym z szablonu?

[stellatus]

A w jakim momencie doczytywany jest Twój plik styli, przed czy za tym z szablonu?

Mój plik CSS jest ważniejszy niż ten z szablonu.

To jak mowilem, okresl swoja dokladniejsza sciezke do blockquote, bo zakladam ze one i tak leza w jakims divie

twojdiv blockquote::before {

Selektory z wieksza dokladnoscia maja pierwszenstwo

Dzięki, tylko ja bym chciał, żeby wszędzie, na całym blogu, mój CSS dla <blocquote> był obowiązujący.


Ten post edytował stellatus 22.04.2020, 12:43:48

[trueblue]

Mój plik CSS jest ważniejszy niż ten z szablonu.

Czyli za tym z szablonu, tak?

[stellatus]

Tak.

[trueblue]

Zobacz jaka jest kolejność przyporządkowywania styli w: F12->Elements (kliknij na stronie element)->boczny panel->Styles (na Chrome).

[stellatus]

Dokładnie wygląda to tak:

[trueblue]

I co, element nie ma padding 0.5rem?

[stellatus]

Ma. Nie jestem pewien czy jestem dobrze zrozumiany. Interesuje jakiś sprytny sposób na skreślenie wszystkich atrybutów <blockquote> zdefiniowanych w all-light.min.css. Nie chcę tego robić w ten sposób, że do swojego <blockquote> wpisuję po kolei:

Kod

max-width: myvalue;
margin-left: myvalue;
margin-right: myvalue;
text-align: myvalue;
font: myvalue;
font-family: myvalue;
letter-spacing: myvalue;
color: myvalue;

itd.

Wydaje się stratą czasu szukanie odpowiednich wartości atrybutów, skoro potrzebuję wartości takich jakie byłyby wtedy gdyby wykreślić z oryginalnego blockquote to, co jeszcze nie jest wykreślone.

[trueblue]

Nie ma jeszcze w pełni takiej możliwości: https://developer.mozilla.org/en-US/docs/Web/CSS/revert

[viking]

Gdyby to był SASS mógłbyś stosować np ify. W CSS wszystkie wartości są dziedziczone i jeśli raz wystąpiły jedyne co możesz zrobić to je nadpisać np domyślnymi.

[stellatus]

Spoko. Problem chyba jest rozwiązany. Plik style.css w child theme WordPressa chyba ma właściwość, której potrzebuję. Wygląda na to, że wszelkie selektory jakie tam wpiszę są jedynie obowiązujące. Jutro będę to jeszcze testował i dam znać.

Edycja:
Jednak się pomyliłem, ale wymyśliłem, że można byłoby usuwać JS-em fragmenty arkusza, które są niepotrzebne, np.:

Kod

function ShowResults(element, index) {
  document.styleSheets[NUMBER X].cssRules[NUMBER Y].style.removeProperty(element)
            }
            let input = document.styleSheets[NUMBER X].cssRules[NUMBER Y].style
            let inputList = Array.prototype.slice.call(input)
            inputList.forEach(ShowResults)

Edycja:
Rozwiązanie jednak marne. Każda przeglądarka indeksuje arkusze stylów inaczej. To raczej trzeba zrobić poprzez jakąś kwerendę, a nie wskazywanie konkretnych indeksów.

Ten post edytował stellatus 23.04.2020, 13:34:32