1

I am trying to make the following anchor tags look bolder on hover, without using any external or embedded CSS file, can I make them look bolder by applying inline style?

<a href="https://en.wikipedia.org/wiki/Internet_of_Things"  target="_blank" ">Internet of things<br></a>
<a href="https://en.wikipedia.org/wiki/Machine_to_machine"  target="_blank">M2M<br></a>
<a href="https://en.wikipedia.org/wiki/Mesh_networking"  target="_blank">Mesh Network<br></a>
<a href="https://en.wikipedia.org/wiki/Telemetry"  target="_blank">Telemetry<br></a>
<a href="https://en.wikipedia.org/wiki/Wireless_sensor_network"  target="_blank">WSN</a>
TylerH
  • 20,799
  • 66
  • 75
  • 101
AhmetSkc
  • 21
  • 2
  • 4

2 Answers2

0

According to this, no: How to write a:hover in inline CSS?

But you can do it with javascript, using the onmouseover event

Community
  • 1
  • 1
BobbyTables
  • 4,481
  • 1
  • 31
  • 39
0

You can't do it with inline CSS. You have to use normal <style> tag or a separate sheet:

a {
    font-weight: normal;
}

a:hover {
    font-weight: bold;
}

I strongly recommend that you try to do it with CSS, but if you must do it with JS, here's a solution:

<a href="https://en.wikipedia.org/wiki/Internet_of_Things" onmouseover="this.style.fontWeight='bold'" onmouseout="this.style.fontWeight='normal'" target="_blank" ">Internet of things<br></a>

Here's a fiddle:

http://jsfiddle.net/72ehppr1/

Reuven Karasik
  • 475
  • 5
  • 14