본문 바로가기
728x90
반응형

기초17

JS- 카멜 표기법, 스네이크 표기법(규칙) JS- 카멜 표기법, 스네이크 표기법(규칙) 오늘은 JS를 사용하시면서 간단한 규칙에 대해 말씀드리겠습니다. 바로 카멜 표기법, 스네이크 표기법인데요! 두 가지 규칙은 모두 이름과 관련이 있는 규칙입니다. JS를 공부하시면서 변수나 함수를 사용할 때 해당 변수나 함수가 어떤 역할을 하는지 나뿐만 아니라 팀원들이 모두 알 수 있게 이름을 사용하고 있는데 이때 카멜 표기법과 스네이크 표기법을 사용하고 있습니다. (1) 카멜 표기법 먼저 카멜 표기법은 첫 번째 단어 이후 이어지는 단어의 첫 글자는 대문자로 쓰는 방식입니다. 카멜 표기법이라고 부르는 이유는 낙타의 형태와 닮았다고 해서 붙어지게 되었습니다. 예시를 보여드리면 만약 함수가 사용하는 유저의 이름에 관련된 함수라고 했을 때 user과 name을 사용하.. 2022. 11. 17.
JS- 이벤트(event) JS- 이벤트(event) 오늘은 JS를 사용해서 사용자와 상호작용을 할 수 있는 이벤트에 대해 간단하게 알아보도록 하겠습니다. 여기서 이벤트란 웹페이지에서 마우스를 클릭하거나, 키를 입력하는 등 사용자가 웹페이지를 동작할 경우 어떤 사건을 발생시키는 것을 의미합니다. JS에서는 수없이 많은 이벤트가 존재하기 때문에 다양한 사건을 발생시키는 것이 가능합니다. 위에 예시처럼 사용자가 마우스를 클릭하거나, 키보드를 사용하여 키를 입력하는 방식도 있고 웹페이지의 이동이나 로딩, 스크롤바의 움직임 등등 다양한 방식의 이벤트가 존재합니다. 이벤트를 연결하는 방식에는 HTML 태그에 작성하는 인라인 방식, HTML body 태그 이후에 작성하는 방식 등이 있으나 오늘은 HTML 태그에 작성하는 인라인 방식을 통해 .. 2022. 9. 26.
CSS 기초(7) 선택자(1) 태그 선택자, class 선택자, id 선택자, 부모, 자식, 형재 선택자 CSS 기초(7) 오늘은 CSS에서 선택자를 지정하는 방법에 대해 알려드리겠습니다. 선택자를 지정하는 방식에는 직접 태그를 선택할 수도 있고 class 속성이나 id 속성을 지정할 수도 있습니다. 더 나아가 부모 태그, 자식 태그, 형재 태그를 이용하여 선택자를 지정할 수도 있는데요. 오늘은 태그 선택자, class 선택자, id 선택자, 부모, 자식, 형재 선택자 까지 다루어보겠습니다. (1) 태그 선택자 먼저 태그 선택자입니다. 태그 선택자는 말 그대로 HTML에서 태그를 직접 선택하는 방식으로 CSS에서는 '태그{속성: 속성 값;}'으로 작성할 수 있습니다. 태그 선택자의 단점은 태그가 겹치는 것이 없다면 해당하지는 않지만 만약 태그가 겹치는 상황이 생겨서 원하지 않은 태그에도 스타일이 지정될 수 .. 2022. 7. 12.
CSS 기초(6) background-image 심화 CSS 기초(6) 오늘은 background-image 속성에 대해 더 자세히 배워보겠습니다. 저번 시간에 내용을 복습해보면 CSS에서는 background-image 속성을 '선택자{background-image: url(이미지 경로/ 이미지);}'로 작성하여 사용할 수 있습니다. background-image 속성을 사용하면 이미지의 크기와 지정한 배경의 크기가 맞지 않는 경우가 생기는데요. 이럴 경우에 사용할 수 있는 방법에 대해 알아보겠습니다. (1) 먼저 알려드릴 것은 이미지의 크기와 배경의 크기가 맞지 않을 경우 발생하는 현상인데요. 이때 사진에서 처럼 빈 공간을 채우기 위해 사진이 여러 장으로 나타나는 것을 볼 수 있습니다. 이럴 때는 배경의 크기를 이미지의 크기에 맞게 줄이거나 이미지의 연.. 2022. 7. 12.
728x90
반응형

티스토리툴바