Css - szelektor kapcsolatok, informatikai vezető
Ebben a leckében megnézzük a kapcsolat szelektor segítségével választhatjuk ki a megfelelő terméket, attól függően, hogy hogyan viszonyulnak a többi elem a weblapon.
Típusú kapcsolatok az elemek között
Minden elem a weboldalon lehet csatlakoztatni a másik elem révén az alábbi összefüggések:
- szülő elem közvetlen őse - az elem, amely tartalmaz egy vagy több elemet beágyazva. Ezekhez az elemek beágyazott vele, ő a szülő;
- gyermek elem közvetlen leszármazottja, egy gyerek, egy gyerek - egy elem, amely be van ágyazva a szülő elem és kapcsolatban van a gyermek elem, azaz gyermekét;
- szomszédos elem testvér (testvére) - elemek egy közös szülő. Az ilyen elemek egymáshoz képest testvérek (szomszédok).
Tekintsük a következő példát:
Ez a kód képviselik a következő séma szerint:
A fenti példában úgy döntünk, p tagja, és megvizsgálja, hogyan kapcsolódik más elemekkel a kódot:
- Szülő elem - div;
- A szomszédos elem - h1;
- Közvetlen leszármazottai, a gyerekek - tagjai erős. em.
item1 item2
Ez a szelektor item1 és item2 összekapcsolt ratio „ős leszármazottja”. Ie azt lehet beállítani, hogy elementov2. amelyek belsejében található elementa1 egy HTML dokumentumban. Más szóval, kiválasztja az összes elementy2. akik leszármazottai elementa1.
Például válassza ki és telepítse a stílus minden p elemre. amely a gyermek elem div:
1. elem> item2
Ez a szelektor item1 és item2 kapcsolt „szülő> gyermek.” Ie azt lehet beállítani, hogy elementov2. akik a gyerekek elementa1. Más szóval, kiválasztja az összes elementy2. akiknek gyermeke item1.
Például válassza ki és telepítse a stílus minden p elemre. akinek szülő div elemben:
1. elem + item2
1. elem + item2 választó kiválasztására elementov2. amelyek székhelye után azonnal elementa1. és azok egymáshoz viszonyított szomszédok. Más szóval, a szelektor kiválasztására elementa2. amelynek székhelye után azonnal elementa1. és azonosnak kell lennie a szülő a HTML dokumentumban.
Például válassza ki és telepítse a stílus minden p elemre. amelynek székhelye után azonnal div elem. És akkor ki kell választania csak azokat az elemeket o. amelyek ugyanazon a szinten a hierarchia, mint az elemek div. azaz kell lenniük az egymáshoz képest szomszédok:
Item2 kiválasztására elementov2. amelyek székhelye után elementa1. és azok egymáshoz viszonyított szomszédok. Más szóval, a szelektor kiválasztására elementov2. amelyek székhelye után elementa1. és azonosnak kell lennie a szülő a HTML dokumentumban.
Például válassza ki és telepítse a stílus minden p elemre. ami után helyezkedik div elem. És akkor ki kell választania csak azokat az elemeket o. amelyek ugyanazon a szinten a hierarchia, mint az elemek div. azaz kell lenniük az egymáshoz képest szomszédok: