Forum PHP.pl > [css] warunek w css?

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki

SN@JPER^

26.04.2015, 21:45:04

Witam.

Jest jakaś reguła warunków w css?

Coś w stylu, że jeśli game.li:hover to inna klasa też zmienia wartości.

Np.

[HTML] pobierz, plaintext 
.all .menu_left ul li.games:hover{
 
        background-color: #ffb10a;
        color: #000;
 
        .all .menu_left ul li.games span.icon{
            background: url('../images/icon_games.png') no-repeat;
 
       }
 
 }
[HTML] pobierz, plaintext

Kshyhoo

26.04.2015, 21:49:25

Cytat

[if {!} browser]
[if {!} browser version]
[if {!} condition browser version]

where:

! - indicates negation of the statement (i.e. NOT) - optional
browser - states which browser the statement targets
'IE' - Internet Explorer
'Gecko' - Gecko based browsers (Firefox, Camino etc)
'Webkit' - Webkit based browsers (Safari, Chrome, Shiira etc)
'SafMob' - Mobile Safari (iPhone / iPod Touch)
'Opera' - Opera's browser
'IEMac' - Internet Explorer for the Mac
'Konq' - Konqueror
'IEmob' - IE mobile
'PSP' - Playstation Portable
'NetF' - Net Front
version - which version of the browser in question should be considered
condition - arithmetic operator
lt - Less than
lte - Less than or equal to
eq - Equal to
gte - Greater than or equal to
gt - Greater then

com

26.04.2015, 21:50:13

to w less albo sass albo scss

PrinceOfPersia

26.04.2015, 22:09:10

wszystko fajnie, tylko, że to się akurat da załatwić w czystym CSS:

[CSS] pobierz, plaintext 
.all .menu_left ul li.games:hover{
    background-color: #ffb10a;
    color: #000;
}
 
.all .menu_left ul li.games:hover span icon {
  background: url('../images/icon_games.png') no-repeat;
}
[CSS] pobierz, plaintext

(pseudoklasa :hover wcale nie musi być na końcu deklaracji CSS, może być w środku).

edit:
chociaż i tak pod kątem pisania kodu ładniej by to wyglądało w Sass czy SCSS:

[CSS] pobierz, plaintext 
.all .menu_left ul li.games{
    font-family: sans-serif; //na przykład;
    display: block; // na przykład
    &:hover {
        background-color: #ffb10a;
        color: #000;
        span icon {
          background: url('../images/icon_games.png') no-repeat;
       }
    }
}
[CSS] pobierz, plaintext

w scss nie musisz powtarzać tych samych selektorów, tylko w jednym drzewie masz deklaracje dla elementu normalnie (bez hovera), tam tylko piszesz &:hover i otwierasz klamrę z deklaracjami dla :hover, tam dodajesz kolejne selektory dzieci (span icon) itp.

com

26.04.2015, 22:14:22

@up zgadza się, ale autor wrzucił składnie która bez problemu podciągnie pod lessa

a to itak rybka bo potem otrzymujemy po skomplikowaniu własnie taki kod, tylko łatwiej sie pisze

PrinceOfPersia

26.04.2015, 22:17:12

pewnie też, chociaż z lessa mało korzystałem, głównie z sass/scss, więc w tym wrzuciłem przykład.

com

26.04.2015, 22:19:07

to już kwestia przyzwyczajenia w czy się to pisze tak naprawdę

a ja odnosiłem się do pierwszej części gdzie napisałeś że da się w css

SN@JPER^

26.04.2015, 22:26:08

Dzięki, wykorzystałem kod w czystym CSS.

Frameworków jeszcze nie używam, nie umiem.

tzm

26.04.2015, 22:56:25

Cytat

'IEMac' - Internet Explorer for the Mac

STORY

edit: sory, nie mogłem się powstrzymać

PrinceOfPersia

26.04.2015, 23:28:58

kiedyś był, na jakiej starej prezentacji Apple widziałem jak się chwalii tym, że i Microsoft Word i Internet Explorer działa na Maku...

com

26.04.2015, 23:33:31

https://www.wikiwand.com/pl/Internet_Explorer_for_Mac

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.