코딩 121
[sass/scss] 자동 컴파일하기
오늘은 scss 사용 시 컴파일하는 법을 알아보겠습니다. 1. 실행창 열기 먼저 실행창을 열어줍니다. 시작에서 실행을 검색해 여는 방법과 window + R 단축키를 눌러 여는 방법이 있습니다. *window키는 ctrl과 alt 사이에 있는 키 2. 명령 프롬프트(cmd) 열기 위의 이미지에서 이미 쓰여있었지만 실행창을 열었다면 cmd를 입력해 명령 프롬프트를 실행합니다. 실행하면 이런 명령 프롬프트가 열립니다. 3. 파일 경로 바꾸기 기본은 C로 경로가 잡혀있습니다. 우선 scss작업을 할 폴더로 경로를 옮겨줍니다. 저는 D폴더에 있어 일단 d로 경로를 이동했습니다. d로 경로를 이동할 땐 d:이라고 입력합니다. 엔터를 누르면 이렇게 D드라이브로 이동됩니다. 다음은 cd명령어를 이용해 scss를 실행..
[html] <span>
안녕하세요. 플입니다. 오늘은 태그에 대해 알아보겠습니다. 1. 태그 span은 '기간, 폭'을 뜻하는 영어단어입니다. 태그로서 가지는 의미는 가상의 폭. 즉, 가상의 공간을 가지게 됩니다. 사실 영어 의미는 이해 못하셔도 괜찮습니다. '아 태그는 공간'정도만 알고 계시면 됩니다. 태그는 와 같이 공간을 지정해주는 태그입니다. 와 다른 점은 inline요소라는 점입니다. 2. 태그의 활용 스팬 태그는 보통 큰 의미가 있는 곳에 사용하는 태그는 아니고 디자인적으로 구분이 필요할 때 주로 사용합니다. 예를 들어 의미가 있는 태그는 태그나 태그 등이 있습니다. 태그는 링크를 태그는 이미지를 의미하죠. 표시된 부분은 태그로 할 예정입니다. 그런데 문제가 있습니다. 아시겠나요? 배경에도 색이 들어가고, 텍스트 부..
[css] hover로 색 바꾸기
안녕하세요. 플입니다. 오늘은 hover를 이용해 마우스 오버 시 색을 변경해보겠습니다. ▷hover hover는 '맴돌다'라는 뜻을 가진 영어단어입니다. 마우스가 위에서 맴돌고 있을 때라고 이해할 수 있습니다. 저는 마우스 오버 시 적용되는 css로 생각하고 작업합니다. ▷사용 이유 hover를 사용하는 건 사용자의 편의를 위해 들어가는 효과입니다. 마우스를 올렸을 때 어떤 효과가 적용되거나 마우스의 모양이 손가락 모양이 되면 사용자들은 '클릭을 하는 부분'이라는 것을 직감적으로 알게 됩니다. 오늘 예시로 사용할 메뉴 색상을 변경하는 것을 살펴보면 마우스를 올렸을 때 색상이 변경되면 사용자는 클릭하는 부분이라는 것을 쉽게 알 수 있습니다. 이처럼 사용자의 클릭을 유도해 조금 더 쉽게 홈페이지를 이용할 ..
[Javascript] 변수 범위
안녕하세요. 플입니다. 오늘은 변수 범위를 알아보겠습니다. 변수에 대해 궁금하시다면 아래 링크를 확인해주세요. https://ssimplay.tistory.com/54 [Javascript] 변수 설정하기 안녕하세요. 플입니다. 오늘은 변수를 설정해보겠습니다. ▷변수 변수란 쉽게 말해 새로운 이름을 지어주는 것입니다. 예를 들자면 줄임말과 같습니다. 최근엔 줄임말이 굉장히 많죠. '세젤귀'는 '세상에서 제일.. ssimplay.tistory.com ▷변수 범위 변수 범위에는 크게 두 가지 종류가 있습니다. 종류 설명 전역 범위 프로그램의 어디서든 사용할 수 있다 지역 범위 프로그램의 제한된 범위 안에서만 사용할 수 있다 두 가지의 범위가 어떻게 다른지 예시로 살펴보겠습니다. 1. 전체 코드 살펴보기 va..
[Javascript] 변수 설정하기
안녕하세요. 플입니다. 오늘은 변수를 설정해보겠습니다. ▷변수 변수란 쉽게 말해 새로운 이름을 지어주는 것입니다. 예를 들자면 줄임말과 같습니다. 최근엔 줄임말이 굉장히 많죠. '세젤귀'는 '세상에서 제일 귀여운'의 줄임말입니다. 여기서 '세젤귀'가 변수입니다. 세상에서 제일 귀엽다고 말해도 되지만 세젤귀라고 줄여 부르는 것이 빠르고 간편하게 말할 수 있죠. 변수 역시 빠르고 간편하게 코딩을 하기 위해 사용합니다. 1. var var 위의 코드를 참고해서 봐주세요. 우선 변수를 설정하기 전에 앞쪽에 var이라는 단어를 적어줍니다. var은 변수라는 의미의 영어단어 'variable'의 약자로 지금 적는 단어가 변수라는 것을 알려줍니다. var을 적지 않았을 때 오류가 발생하지는 않으나 코딩이 길어졌을 때..