When you hover over the button, the button should be highlighted, and when the user removes the mouse, it will no longer glow

<!-- задаю для всех div-ов класс price --> <style> .price { display:inline-block; width:400px; color:blue; } </style> <form name="forma1" style="background-color:#44944A;"> <!-- поменяю цвет формы --> <div id="resizable"> <!--"подрасчёт 1.1"--> <table align="center"> <br> <p align="center">Глубина установки конца заливочных труб</p> <tr> <td height="40px"> <div class="price" title="H1">Расстояние от устья скважины до нижних отверстий фильтра, м;</div> <input name="t1" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="t3" class="h1" data="4550"> </td></tr> <tr><td height="40px"> <div class="price" title="H2">Расстояние от устья скважины до верхних отверстий фильтра, м;</div> <input name="t2" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="t3" class="h2" data="4566"> </td></tr> <tr><td height="40px"> <div class="price">Интервал отверстий фильтра, м;</div> <input name="t3" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="t3" class="l1"> </td> </tr> <tr><td height="40px"> <div class="price">Плотность цементного раствора, кг/м<sup>3</sup>;</div> <input name="t4" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="pup" data="1800"> </td></tr> <tr><td height="40px"> <div class="price">Плотность жидкости, находящейся в скважине, кг/м<sup>3</sup>;</div> <input name="t5" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="pzh" data="1080"> </td></tr> <tr><td> <input type="button" name="button" value="Вычислить" onClick="areaRectangle();"> <input type="button" name="button" value="Вычислить Демо" id="demo"> <input type="text" name="res" size="10" id="l"> </td></tr> </table> </div> <br> </form>

    1 answer 1

     .price { display:inline-block; width:400px; color:blue; } input[type="button"]:hover { box-shadow: 0 0 5px 3px white; } 
     <form name="forma1" style="background-color:#44944A;"> <!-- поменяю цвет формы --> <div id="resizable"> <!--"подрасчёт 1.1"--> <table align="center"> <br> <p align="center">Глубина установки конца заливочных труб</p> <tr> <td height="40px"> <div class="price" title="H1">Расстояние от устья скважины до нижних отверстий фильтра, м;</div> <input name="t1" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="t3" class="h1" data="4550"> </td></tr> <tr><td height="40px"> <div class="price" title="H2">Расстояние от устья скважины до верхних отверстий фильтра, м;</div> <input name="t2" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="t3" class="h2" data="4566"> </td></tr> <tr><td height="40px"> <div class="price">Интервал отверстий фильтра, м;</div> <input name="t3" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="t3" class="l1"> </td> </tr> <tr><td height="40px"> <div class="price">Плотность цементного раствора, кг/м<sup>3</sup>;</div> <input name="t4" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="pup" data="1800"> </td></tr> <tr><td height="40px"> <div class="price">Плотность жидкости, находящейся в скважине, кг/м<sup>3</sup>;</div> <input name="t5" type="text" align="right" size="4" maxlength="8" onkeyup="return proverka(this)" id="pzh" data="1080"> </td></tr> <tr><td> <input type="button" name="button" value="Вычислить" onClick="areaRectangle();"> <input type="button" name="button" value="Вычислить Демо" id="demo"> <input type="text" name="res" size="10" id="l"> </td></tr> </table> </div> <br> </form>