เลือกทุก <a> ที่ href มีคำว่า java ด้วย CSS

ใช้ Selector [attribute*="value"] เพื่อเลือกอิลิเมนต์ที่ค่าแอตทริบิวต์มีข้อความที่ระบุอยู่

ตัวอย่างโค้ด

ลองรันโค้ดด้านล่างเพื่อทดสอบ CSS [attribute*="value"] selector:

<!DOCTYPE html>
<html>
<head>
  <style>
    [href*="java"] {
      border: 5px solid orange;
      border-radius: 5px;
    }
  </style>
</head>
<body>
  <a href="https://www.tutorialspoint.com/php/index.htm">PHP Tutorial</a>
  <a href="https://tutorialspoint.com/java/index.htm">Java Tutorial</a>
</body>
</html>

ผลลัพธ์: ลิงก์ที่สองมีขอบสีส้มเพราะ href มีคำว่า "java" ลิงก์แรกเป็น "php" จึงไม่ตรง เหมือน ID 1004062767 แต่ใช้กับ href แทน alt