CSS තෝරාගැනීමේදී බහු සෙලෙක්ටර භාවිතා කිරීමේ දෝෂය
අධ්යාපන අරම්භකයන්ගේ සුප්රසිද්ධ දෝෂය ගැන මතක් කර දෙමි: සෙලෙක්ටර
.bbb.zzz සහ සෙලෙක්ටර .bbb .zzz
විවිධ කාර්යයන් සිදු කරයි. පළමුවැන්න සමගාමීව පන්ති දෙකක් ඇති අංගයක්
සොයා ගනී, දෙවැන්න
- bbb පන්තිය තුළ පිහිටා ඇති,
zzz පන්තිය සහිත අංගයක්
සොයා ගනී.
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
h2.zzz {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
h2 .zzz {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
.bbb.zzz {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
.bbb .zzz {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
.bbb.zzz.xxx {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
.bbb .zzz.xxx {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
.bbb.zzz .xxx {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
.bbb .zzz .xxx {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
#elem.bbb {
color: red;
}
පහත දක්වා ඇති කේතයේ සෙලෙක්ටරය කුමක් තෝරා ගන්නේදැයි පැහැදිලි කරන්න. ඉන්පසු එම සෙලෙක්ටරයට ගැලපෙන HTML කේතය ලියන්න. සෙලෙක්ටරය සහිත කේතය මෙන්න:
#elem .bbb {
color: red;
}