어제 오늘 내일

경우에 따라 input 항목에 자동으로 포커스를 이동시켜서 사용자 편의를 증가시킬 수 있습니다. 다음은, 버튼 클릭 시 input 항목에 focus를 이동시키는 예제입니다. focus() 클릭하세요 function btnClick() { const myinput = document.getElementById('my-input'); myinput.focus(); } HTML 버튼 클릭 시, btnClick() 함수를 호출합니다. JAVASCRIPT document.getElementById('my-input'); getElementById() 함수를 이용하여, 포커스를 이동시킬 input 요소를 선택합니다. myinput.focus(); focus() 함수를 이용하여, 포커스를 input 요소로 이동시킵니..

지난번에는 버튼의 배경색을 변경하는 방법을 알아보았습니다. [HTML/CSS] 버튼 배경색 지정하기 그런데, 위 포스팅과 같이 배경색만 변경하면, 마우스 오버, 클릭 등의 액션이 발생해도 배경색이 그대로여서 마치 누를 수 없는 버튼처럼 느껴집니다. 이번에는 버튼에 마우스 오버, 클릭 등의 액션이 일어날 경우 버튼의 배경색을 변경하는 방법을 정리해보겠습니다. :hovor 마우스를 버튼에 올렸을 때, 지정한 스타일이 적용됩니다. :focus 버튼에 마우스가 올려지거나, Tab 키 등을 이용하여 버튼에 포커스가 간 경우에, 지정한 스타일이 적용됩니다. :active 버튼을 마우스로 클릭하고, 클릭을 해제 할 때까지, 지정한 스타일이 적용됩니다. 예제 버튼 .skyblue_btn { background-colo..