반응형
회면클릭반응속도체크
-
JavaScript 입문 : 화면 클릭 반응 속도 체크 - HTML / CSS 화면 보정에 따른 JS구문 업데이트컴퓨터 알아가기/JavaScript 2022. 7. 31. 19:30
화면클릭에 대한 반응속도에 대한 자바스크립트 코딩을 공부해 보았는데 이제 현재 화면이 조금은 멋이 없는 것 같아 화면을 조금 다듬어 보았습니다. 회면에 대한 전체 그림은 다음과 같이 만들어 보았습니다. 1. HTML 구문 전체 태그안에 6개의 태그를 적용하여 각 항목별로 block화 시켜서 자연스럽게 수직으로 배치하게 만들었구요. 특히 지난번에는 카드 자체에 글씨가 나오게 만들었는데 클릭메시지에 대한 별도 태그를 지정해 놓았습니다. 아울러 숙제로 나온 상위 5개 결과를 나타내는 위치도 맨밑에 배치를 하였구요. 2. CSS 구문 CSS구문에서는 타이틀을 가상클래스를 사용하여 밑줄을 만들어 보았습니다. 가상클래스는 ::before와 ::after를 사용하여 효과를 줄 수 있는데 별도 정리를 하도록 하겠습니다..