Đổi màu 1 link khi link ấy được click trên Menu

Làm sao mình có thể đổi màu 1 link khi link ấy được click .yêu cầu là mình click link khác thì link ấy trở lại trạng thái ban đầu và link tiếp theo sẽ đổi màu !

Thực sự không hiểu ý bạn muốn nói, bạn nói rõ ra chút được không ?

Ý bạn là trong 1 mớ link thì chỉ có 0 hoặc 1 link đổi màu?

Bạn xem hướng dẫn này.
https://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_active

1 Like

đúng rồi đó bạn và link khác đổi màu thì link kia bình thường lại

Theo ý của bạn thì liên quan đến css :focus nhiều hơn css :active

https://www.w3schools.com/cssref/sel_focus.asp

website thường có menu mình click vào thì link đó đổi màu , mình click link khác thì link cũ trở lại trạng thái bình thường còn link khác thì đổi màu
Capture

mình test 2 thứ đó rồi nhưng vẫn không thành công bạn à

Nếu như vậy thì mình nghĩ nên sử dụng jQuery để làm, cụ thể thì khi click vào 1 link thì sẽ add cho link đó class .click để đổi màu background. Bạn có thể xem qua đoạn code sau để hiểu hơn:

  • index.html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Test Menu</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<div class="menu">
		<ul>
			<li>Item 1</li>
			<li>Item 2</li>
			<li>Item 3</li>
			<li>Item 4</li>
			<li>Item 5</li>
		</ul>
	</div>
	<script type="text/javascript" src="script.js"></script>
</body>
</html>
  • style.css
li{
	display: inline-block;
}
.click{
	background-color: red;
}
  • script.js
$(document).ready(function() {
	$("li").click(function() {
        // Clear các thẻ li có Class click cũ
		$("li").removeClass("click");
        // Thêm Class
		$(this).addClass("click");
	});
});
3 Likes

div a:hover chẳng hạn bạn
đưa chuột qua trông có vẻ linh hoạt hơn

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?