I'd like to add this to my first web page.
Similar to what Chrome does in web inspector : Hovering and/or clicking an element highlights/selects a corresponding element. I realized my page revolves around this and I can't advance without it. Any constructive advice would be appreciated! Thank you!

CodePudding user response：

You will need to know the position of the element you want to highlight relative to the position of the element to be hovered.

Take a look at this post:

How to affect other elements when one element is hovered

Once you know the position and have used the proper selector use:

background-color : lightblue;

CodePudding user response：

I guess you are asking about :hover in css, but without code it is difficult to get idea. Check below code:

.btn {
  background-color: #f4511e;
  border: none;
  color: white;
  padding: 16px 32px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.6;
  transition: 0.3s;
}

.btn:hover {opacity: 1}

<button class="btn">Hover Over Me</button>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>