html selector code example

Example 1: css attribute selector

a[target="_blank"] {
  background-color: yellow;
}
/*w3schools*/

Example 2: do some css using js on selector

let myElement = document.querySelector("#superman");
myElement.style.backgroundColor = "#D93600";

Example 3: css selectors

* {
color: pink;
}
h1, h2 {Select all h1 and h2}
li a {select all anchor inside a list}
h1 + p {select all p placed after an h1}
div > li {all li directly in a div}

Example 4: queryselector function in javascript

/*The querySelector() method returns the first element that matches a specified 
CSS selector(s) in the document. Note: The querySelector() method only returns 
the first element that matches the specified selectors. To return all the 
matches, use the querySelectorAll() method instead.*/

// for example 

//for class
document.querySelector(".ClassName")

// for id 
document.querySelector("#ID")

// etc.

Example 5: what is a css selector

h1 {
  color: red;
}

In this CSS code example that sets the color of all h1s to red 
the "h1" is the selctor because we are applying this style to 
the h1s.

Tags:

Html Example