html
![[코드 구문 강조] highlight.js를 활용하여 Code구문 강조하기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdXCMnM%2FbtrcORqfteG%2FDdsVyzGKZORhrXtBY1O4w1%2Fimg.png)
[코드 구문 강조] highlight.js를 활용하여 Code구문 강조하기
highlight.js 활용방법 개요 많은 개발자들이 웹사이트에 글을 작성할때 코드 부분을 실제 에디터에서 보이는 것 처럼 강조하기 위한 방법으로 highlight.js을 사용합니다. highlight.js의 2가지 적용 방법 웹 검색을 해보시면, highlight.js를 간단히 적용하는 방법은 2가지로, 많이 나와있습니다. CDN js를 적용하는 방법과 직접 다운로드하여 업로드하는 방법이 있습니다. 1. CDN js를 이용하는 방법 CDNjs 2줄의 코드를 넣으면 초기 설정이 완료되는 간단한 방법입니다. 장점: 업로드 없이 간편하게 구축이 가능하다는 점 단점: 자주 쓰이는 22개의 언어만 강조되는데, 추가 언어를 적용하기 위해서는 직접 다운로드하여야 함. 온라인에선 상관없겠지만, 오프라인 환경에서는 적..
Favicon 파비콘 아이콘! 완벽하게 만드는 방법 & 적용방법
이번 포스팅에서는 일반적인 파비콘 설정보다 더 완벽한 파비콘 설정에 대해 알아볼께요 일반적으로 파비콘(favicon) 설정은 아래와 같이 웹 소스 최상단에 16x16 과 32x32의 이미지를 하나에 품은(multiple sizes) 혹은 단일 사이즈의 favicon.ico 파일을 올려놓는 것으로 끝납니다. Favicon 기본 설정방법 그러나 상기 방법은 초창기 파비콘 설정방법이고 세월이 흘러 현재는 다양한 디바이스와 브라우저를 지원하기 위해서 파비콘 설정을 아래와 같이 작업해주어야 합니다. Favicon 범용 설정방법 ※ 당연히 각 사이즈별 파일은 만들어줘야 합니다. 상기와 같이 설정하면 아이폰, 아이패드, 안드로이드, PC, 구글TV, 구글웹스토어, 오페라 브라우저등을 지원하게 되어 어디에서도 파비콘 ..
![[HTML]Emmet 사용법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdknFiC%2FbtraQqh8vfC%2FGsXYLuwc4nyPQyO63BGMC0%2Fimg.jpg)
[HTML]Emmet 사용법
Emmet이란? 강력한 자동완성 기능 등으로 HTML 작성 속도를 크게 향상시켜주는 플러그인 Emmet (에밋)을 사용하면 HTML & CSS의 작업 속도를 엄청나게 향상시킬 수 있다!! 👏🏽👏🏼👏🏻 VS Code는 emmet을 기본적으로 지원하고 Tab키를 통해 사용한다. 🧶 HTML 구조화 하기 (Nesting operators) Emmet의 문법을 활용하여 요소들의 구조를 간편히 생성할 수 있다. Emmet 문법 요소 (Elements) 생성 생성하려는 요소의 이름을 입력한 뒤 tab을 누르면 태그가 자동 생성된다. Emmet에는 미리 정해진 태그 이름이 없다. 즉, 아무 이름으로나 태그를 생성할 수 있다.(에디터에 따라 그렇지 않은 경우도 있다.) html:5[tab] 결과: helloworld[..
코린이의 성장 일기
Welcome To Growth Diary 코린이의 성장 일기 안녕하세요. 다들 코딩에 관심 있으신가요? 코딩해보셨나요? 코딩.. 잘 하시나요?... 부럽... 제1 목표는 WEB 뿌시기입니다. -저만의 포트폴리오가 담긴 웹페이지 구축!!! 제2 목표는 파이썬 뿌시기입니다. -파이썬으로 시작하는 데이터 분석~ 제대로 배운 게 없어서 기초를 쌓아보고자 합니다. 원래 기초공사가 중요하다고들 하잖아요?! 정말 갈길이 멀죠?ㅎㅎ 지켜봐주세요! 앞으로 열심히 해보도록 하겠습니다!