신형준의 기술 블로그 신형준의 기술 블로그

CSS

• SVG background로 넣기

  프론트엔드/CSS 2022. 1. 24. 19:49

  # What? SVG를 ie도 호환되게 배경이미지로 까는방법 # How? 1. svg 파일 준비 2. svg파일을 코드 에디터로 열어 통째로 복사해서 base64 인코딩하기 https://www.base64encode.net/ Base64 Encode - Online Tool Base64 encode Encode base64 string from 'base64 encoder' to 'YmFzZTY0IGRlY29kZXI=' www.base64encode.net 3. background-image: url('data:image/svg+xml; base64, base64인코딩 결과물'); 와 같은 형태로 붙여넣기

  Read More

• 01. Sass란?

  프론트엔드/Sass 2021. 7. 14. 13:47

  # What? Sass란 - css 전처리기 # Why? 이걸 왜 알아야돼? - css를 약간 프로그래밍하듯이 작업 가능함. 자주 쓰는 스타일을 변수명으로 선언해놓는다던지 등. => 재활용, 짧은 코드로 반복성 노가다 제거 # How? 1) Visual Studio를 쓴다면 1. Visual Studio 설치 2. 플러그인 Sass, Live Sass Compiler 설치 3. Sass폴더 만들고 안에다 scss 파일 생성 4. Visual Studio 하단탭에 Watch Sass 클릭 5. 이제 scss 작업할때마다 알아서 css 파일로 컴파일됨 * css 저장되는 경로 바꾸고싶으면 Settings > Text Editor > Files > settings.json에서 savePath 수정 (Edit ..

  Read More

• 01. CSS

  프론트엔드/CSS 2020. 9. 1. 19:49

  # What? 이게 뭔데? Cascading Style Sheets의 약자로, html 문서를 꾸밀 때 사용함. # How? 어떻게 쓰는데? 일반 태그 class명이 text id명이 text * 코드 참고 : https://github.com/ShinHyungJune/publishing-course/tree/css-01-init

  Read More

• 기본 세팅

  프론트엔드/Chart.js 2020. 6. 23. 16:28

  1. 기본 세팅 https://www.chartjs.org/docs/latest/getting-started/

  Read More