2019.2.22 选中改变文本背景及颜色_vs2019怎么改变背景颜色-CSDN博客

本文链接：https://blog.csdn.net/wl_heike/article/details/87886589

1.css实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
       body{
           padding: 0 150px;
       }
       p{
           font-size:30px;
       }

    /*实现选中改变背景及字体颜色效果*/
       ::selection{
              background: gray;
              color: #0000FF;

       }
    </style>
</head>
<body>
    <p >选中我可以改变背景及字体颜色</p>
</body>
</html>

2.js实现

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <style type="text/css">
           body{
           padding: 0 150px;
       }
       p{
           font-size:30px;
       }
       </style>
   </head>
   <body>
          <p id="p">选中我可以改变背景及字体颜色选中我可以改变背景及字体颜色选中我可以改变背景及字体颜色选中我可以改变背景及字体颜色选中我可以改变背景及字体颜色</p>
          <script type="text/javascript">
           var p=document.getElementById("p");
          //鼠标事件
           p.onmousedownenter=function(){
               p.style.color='blue';
               p.style.background="gray";
           }

          </script>
   </body>
</html>