CSS

SASS란 무엇인가? CSS 전처리기란? CSS 전처리기는 CSS 코드를 작성할 때 보다 효과적이고 조직적으로 스타일을 관리하기 위한 스크립팅 언어입니다. 이 전처리기는 특별한 문법을 사용하여 작성되며, 웹사이트를 실행하기 전에 일반 CSS로 컴파일됩니다. SASS에는 SCSS와 Sass가 있습니다. SASS 사용의 장점 코드 재사용: 믹스인, 변수, 함수 등을 사용하여 코드 중복을 줄임 유지 및 관리 용이성: 분할 및 구조화된 코드 관리 고급 기능 사용: 조건문, 반복문, 연산 등 SCSS와 Sass의 차이 Sass는 CSS 전처리기의 한 형태로, 처음에는 들여쓰기 기반의 문법을 사용했습니다. 이를 "들여쓰기 문법" 또는 간단히 "Sass"라고 부릅니다. SCSS는 Sass의 새로운 문법이며, CSS와..

개요SSAFY에서 프론트 수업을 한 지도 3일이 되었습니다. 같은 반 사람들의 코드리뷰를 해주면서 알게 된 공통적인 실수들을 모아보았습니다.사실 저도 이번에 알려주면서 새로 알게 된 부분들도 많답니다! 😂함께 체크해보아요!  1. HTML과 CSS의 역할 분리를 명확히 해주세요.HTML  : HyperText Markup Language의 약자로, 웹 페이지의 구조와 콘텐츠를 정의하는데 사용CSS    : Cascading Style Sheets의 약자로, 웹 페이지의 스타일을 정의하는 데 사용HTML은 구조와 콘텐츠 정의를 하는 데 사용되어야 합니다.이 말 뜻은, 태그 사용시 스타일을 고려하지 말고 콘텐츠에 집중하여야 한다는 말입니다. 가장 많이 하는 실수가, 중요하지는 않아도 디자인에서 글씨가 크다..

개요 오늘은 CSS를 처음 배울 싸피 친구들을 위해 초간단 요약본을 준비해보았습니다. 교육과정에 CSS가 있긴 하지만, 처음 배우는 친구들은 짧은 시간에 지나가는 수업만 듣고 코딩하기는 많이 어려우실거에요. 미리 한번 훑고 수업을 들으면 더 좋을겁니다! 이 글 내용을 외우지 못하더라도 과제를 할 때 검색하며 할 수 있으실겁니다. CSS 겁내지 말아요! CCS란 무엇인가요? 정의 CSS (Cascading Style Sheets)는 웹 페이지의 디자인과 레이아웃을 정의하는 언어입니다. HTML은 웹 페이지의 구조와 내용을 정의하는 반면, CSS는 그 내용이 어떻게 보여질지를 정의합니다. 간단히 말해, CSS는 스타일을 지정하여 웹 페이지를 아름답게 꾸미기 위해 사용됩니다. CSS의 작동 방식 CSS는 선택..

이 글은 udemy의 강의 를 듣고 정리한 글 입니다. CSS transitions options CSS로 애니메이션을 표현할 때 필요한 transition은 지연시키는 의미입니다. 버튼이 1프레임만에 색이 확확 바뀌면 너무 기계적이니 0.5초동안 천천히 바뀌도록 할 수 있죠. transition의 프로퍼티는 아래와 같습니다. 프로퍼티 설명 기본값 transition-property 트랜지션의 대상이 되는 CSS 프로퍼티 지정 all transition-duration 트랜지션이 일어나는 지속시간(duration)을 초 단위(s)또는 밀리 초 단위(ms)로 지정한다. 0s transition-timing-funtion 트랜지션 효과를 위한 수치 함수를 지정한다. ease transtition-delay ..