[css] textarea

textarea관련해서 자주사용하는 style과 스크립트 코드를 정리해두었다.

 

1. 글자 간격 조절

textarea{
	line-height: 20px; 
}

2. 테두리 제거

textarea{
   border: none;
}

3. 포커싱 되었을 때 테두리 제거

textarea:focus{
	outline:none;
}

4. 줄 바꿈시 높이 변경 

<script
  src="https://code.jquery.com/jquery-3.5.1.min.js"
  integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
  crossorigin="anonymous"></script>
  
<script>
  function adjustHeight() {
      var textEle = $('textarea');
      textEle[0].style.height = 'auto';
      var textEleHeight = textEle.prop('scrollHeight');
      textEle.css('height', textEleHeight);
    };

  var textEle = $('textarea');
      textEle.on('keyup', function() {
    adjustHeight();
  });
</script>