რთული სელექტორები ბმულების მდგომარეობებთან CSS-ში

ყველა რთული სელექტორი, რომელსაც აქამდე ვსწავლობდით, შეიძლება გამოყენებულ იქნას ბმულებისთვისაც.

მოდით შევხედოთ მაგალითს. დავუშვათ, ჩვენი ბმულები მდებარეობს ბლოკში მინიჭებული id-ით:

<div id="block">
	<a href="#">link</a>
	<a href="#">link</a>
	<a href="#">link</a>
</div>

მოდით მივანიჭოთ სტილები ამ ბლოკის ბმულებს:

#block a:link, #block a:visited {
	color: red;
}
#block a:hover {
	text-decoration: none;
}

როგორც წესი, link და visited მდგომარეობებს არ აცალკევებენ, ამიტომ კოდის გამარტივება შესაძლებელია შემდეგნაირად:

#block a {
	color: red;
}
#block a:hover {
	text-decoration: none;
}

ახსენით, რას ირჩევს სელექტორი ქვემოთ მოცემულ კოდში. შემდეგ დაწერეთ HTML კოდი, რომელიც შეესაბამება ამ სელექტორს. აი სელექტორის მქონე კოდი:

#test a {
	color: red;
}
#test a:hover {
	text-decoration: none;
}