input 상자를 눌렀을 때 테두리 색과 자리 표시자 글꼴 색을 바꿉니다

 <input type="text" name=""  class="" placeholder="       ">
        <input type="text" name=""  class="" placeholder="       ">
.info_contents_5 .info_con_padding input{
  width: 100%;
  height: 1.46rem;
  margin-bottom: 0.4rem;
  border-radius: 5px;
  border: 1px solid #d8d8d8;
  font-size: 0.64rem;
  padding-left: 0.2rem;
  outline: none;
}
.info_contents_5 .info_con_padding .inputs::-webkit-input-placeholder{/*Webkit browsers*/
  color:#000;
}
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  <script>
    $('input').focus(function(){
     $(this).css('border','1px solid #0678d1')
     $(this).addClass('inputs')
    })
    $('input').blur(function(){
      $(this).css('border','1px solid #d8d8d8')
      $(this).removeClass('inputs')
    })
  </script>

좋은 웹페이지 즐겨찾기