coding 265
css 변수 사용 방법
홈페이지 제작 시 컬러, 패딩, 마진 등등 반복해서 같은 값을 사용해야 하는 경우가 많습니다. 여기에 변수를 사용하면 웹 페이지의 통일성을 유지하는 것은 물론이고 유지보수도 손쉽게 관리할 수 있습니다. :root :root는 문서의 가장 상단 요소를 선택하는 가상 클래스입니다만, 벌써부터 설명이 어려워졌죠. 간단히 말해 html에서 html 선택자 역할을 합니다. 그런데 변수의 범위를 전체에 적용하기 위해 html 선택자 역할을 하는 가상 클래스를 사용한다고 생각해주세요. ▼ 자세한 설명은 아래 문서를 참고해주세요. https://developer.mozilla.org/ko/docs/Web/CSS/:root :root - CSS: Cascading Style Sheets | MDN CSS :root 의사..

visual studio code 유용한 확장 기능 모음 7가지
비주얼 스튜디오 코드에서 유용한 확장 기능 몇 가지를 소개해드릴게요. 1. Korean(사용법) Language Pack for Visual Studio Code visual studio code를 처음 설치하면 영어가 기본 언어인데요 확장 기능을 이용해 한글로 변경할 수 있습니다. 한글 패치 ① Korean(사용법) Language Pack for Visual Studio Code 설치 ② 설치 방법 [coding/editor] - [vs code] 비주얼 스튜디오 코드 한글 패치 하기 [vs code] 비주얼 스튜디오 코드 한글 패치 하기 안녕하세요. 개자이너 씸플레이입니다. 비주얼 스튜디오 코드가 영문판이라 편하게 한글 패치를 해보려고 합니다. [비주얼 스튜디오 코드 다운로드 받기] [coding/..

html 특수기호 코드 -엔티티코드(entity code)
코드 작성시에 특수기호를 사용해야하는 경우가 있습니다. 특수기호는 그대로 쓰면 오류가 생길수도 있는데요 코드로 어떻게 표현하는지 알아봅시다. 1. 자주 사용하는 특수기호 코드 특수기호 엔티티코드 의미(영어) 의미(한글) non-breaking space 공백 > greater than 보다 크다 & & ampersand 그리고(앰퍼샌드) " " double quotation mark 큰 따옴표 ' ' single quotation mark(apostrophe) 작은 따옴표 자주 사용하는건 이정도이고 나머지는 그때그때 검색해서 찾아보시면 됩니다. 주의하실점은 맨 끝에있는 ;(세미콜론)까지가 한 묶음입니다. 꼭 같이 적어주셔야해요. 엔티티 코드 ① html에서 특수기호를 입력해주는 코드 ② 세미콜론..

코딩으로 아이콘 넣기 - font awesome
사이트 제작 시에 디자이너가 아이콘을 모두 만들어준다면 편하겠지만 개인 작업일때도 아이콘을 하나하나 만들면 오래 걸리잖아요? 그래서 이미 있는 아이콘을 무료로 사용할 수 있는 사이트를 알려드립니다. 1. Font Awesome https://fontawesome.com/ Font Awesome The world’s most popular and easiest to use icon set just got an upgrade. More icons. More styles. More Options. fontawesome.com 전에는 아이콘을 부트스트랩 4로 불러왔었는데 최근엔 4버전을 지원하지 않는 건지 찾을 수가 없더라고요. 그래서 아이콘을 불러오는 새로운 방법을 찾아봤습니다. 혹시 정확한 정보를 알고 계시..

비주얼 스튜디오 코드 prettier
코드의 형식을 정해주는 확장 기능 prettier을 설치하고 설정해보겠습니다. 1. 설치 방법 확장 기능 설치 ① 비주얼 스튜디오 코드 왼쪽 메뉴에서 확장을 선택한다. ② 확장 탭 검색창에 prettier 검색. ③ Prettier - Code formatter 설치. 오른쪽 아래에 있는 파란색 설치 버튼을 누르셔도 설치가 되고, 그냥 확장 기능을 눌러서 상세페이지에서 설치를 눌러도 설치가 됩니다. 2. 설정 방법 단축키 [Ctrl + ,]를 누르면 설정창으로 바로 이동할 수 있습니다. 맥에서는 [Cmd + ,]를 눌러주세요. 설정 검색창에 save를 검색하시면 가장 위에 Format On Save를 설정할지 말지 결정하는 체크 박스가 보이실 겁니다. 우리가 설정하는 포맷. 즉, 형식을 저장하려면 체크를..
