Selector CSS wildcard în interiorul numelui clasei (Programare, Css, Selectori Css)

Meek a intrebat.

Aș vrea să știu dacă este posibil să țintesc toate clasele care încep cu col- și se termină cu 12 numai?

De exemplu clase ca:

.col-sm-12
.col-md-12
.col-lg-12

dar nu clase ca:

.col-sm-8
.col-lg-6

Am încercat cu ceva de genul acesta, dar nu funcționează:

[class^="col-*-12"] {
    border: 1px solid red;
}

2 răspunsuri
Sebastian Brosch

Poți folosi următoarea soluție:

Explicație:

  • [class^="col-"]: Clasa trebuie să înceapă cu col-.
  • [class$="-12"]: Clasa trebuie să se termine cu -12.

Puteți găsi o prezentare generală foarte bună a modelului de atribut pe Trucuri CSS.

Comentarii

  • Wow, nu știam că pot fi combinate în acest fel. Mulțumesc mult. –  > Por Meek.
ivp

[class^="col-"][class$="-12"] este ceea ce vă doriți.

Practic, căutați o clasă care începe cu 'col-' în primul rând [].și care se termină cu '-12' în al doilea [].