본문 바로가기

STUDY/html_css2

[HTML/CSS] Sass란? SassSass(Syntactically Awesome Style Sheets)는 CSS의 단점을 보완하기 위한 Preprocessor(전처리 언어)이다. Sass는 css를 변수, 함수, import, 상속 등의 기능 같은 프로그래밍 언어를 작성할 수 있는 문법들을 제공한다.  개발환경 세팅웹 브라우저는 css 파일밖에 모르기 때문에 Sass로 코드를 짰으면 css 파일로 변환해 주는 변환기를 돌려 변환된 css 파일을 html 파일과 사용해야 한다.node.js를 설치해서 변환하는 대신 VScode 에디터를 활용해 보자. VScode의 extension 메뉴에서 Live Sass Compiler를 검색해서 높은 버전을 설치한다. (5.0.0 버전 이상) Sass 파일은 파일명.scss로 생성하면 된다.. 2024. 11. 27.
[HTML/CSS] head 태그에 들어갈 내용 정리 body 내용HTML 문서의 기본 템플릿은 꼭 head, body 태그를 포함해야 한다.head 태그는 사이트 내에서 눈에는 보이지 않는 중요한 정보들이 들어갈 수 있는데, head 태그 내에서 쓸 수 있는 중요한 태그들을 몇 가지 나열해 보자.   1. 각종 css 파일들css 파일들을 첨부할 때 링크 태그를 집어넣을 수 있다.위 경로는 현 html 파일과 같은 위치에 있는 css 폴더 내의 main.css 파일을 첨부하라는 뜻이다.(1) css/main.css(2) /css/main.css(1)은 상대경로로 현재 html 파일과 같은 경로에 있는 css라는 폴더 내의 main.css 파일을 의미,(2)는 절대경로로 현재 사이트의 메인 경로(abcd.com)부터 시작해서 abcd.com/css/main.. 2024. 11. 21.