CSS | CSS 선택자 : 기본 선택자, 복합 선택자, 동작 기반 가상 클래스 선택자, 가상 클래스 선택자, 가상 요소 선택자, 속성 선택자
⭕ CSS | CSS 선택자 : 기본 선택자, 복합 선택자, 동작 기반 가상 클래스 선택자, 가상 클래스 선택자, 가상 요소 선택자, 속성 선택자➡️ 기본 선택자전체 선택자 (*)모든 HTML 요소* { margin: 0; padding: 0; }모든 요소의 마진과 패딩을 0으로 적용함태그 선택자지정된 태그를 의미p { font-size: 16px; }모든 태그에 16픽셀의 글꼴 크기를 적용함클래스 선택자 (.)지정된 클래스를 가진 모든 요소.menu { background-color: blue; }menu 클래스에 파란색 배경을 적용함ID 선택자 (#)특정 ID를 가진 단일 요소자주 사용하지는 않음#header { height: 100px; }header ID에 높이를 100픽셀로 적용함 [프론트엔드..
2024. 5. 16.
CSS | position 위치 속성: Static, Relative, Absolute, Fixed, Sticky
⭕ CSS | position 위치 속성: Static, Relative, Absolute, Fixed, Sticky요소의 위치 지정 기준 ➡️ static (기본 값)요소를 문서 흐름에 따라 배치합니다.positon 설정이 없는 것과 같다.position: static; ➡️ relative (거의 사용하지 않음) static 위치를 기준으로, top, right, bottom, left 값을 사용하여 배치합니다. position: relative;top: 40px; left: 40px; ➡️ ⭐ absolute일반 문서 흐름에서 요소를 제거하고, 위치상 부모 요소를 기준으로 배치합니다.position: absolute;top: 40px; left: 40px; ➡️ fixed일반 문서 흐름에서 요소를..
2024. 5. 14.
Git & GitHub | 포크(Fork), 클론(Clone), 브랜치(Branch), git add, commit, git push, Pull Request (PR)
⭕ Git & GitHub | 포크(Fork), 클론(Clone), 브랜치(Branch), git add, commit, git push, Pull Request (PR) Git: 버전 관리 프로그램GitHub: Git의 기능을 클라우드 저장소로 제공하는 서비스 ➡️ 포크(Fork)다른 사람의 원격 저장소를 복제해서 개인의 저장소를 만드는 방법이다. 이렇게 생성된 개인 저장소는 원본 저장소와 독립적으로 관리된다.주로 다른 프로젝트나 오픈소스에 기여하기 위해 사용된다. 원본 프로젝트와 분리된 환경에서 코드를 안전하게 수정하고 실험할 수 있는 장점이 있다.Fork 한 저장소는 로컬 환경에 Clone 하여 사용한다. 이후 원본 프로젝트로 풀 리퀘스트를 보낼 수 있다. ➡️ 클론(Clone)원격 저장소의 내용을..
2024. 5. 14.
웹 구조 Web | 프론트엔드 개발 기술 목록: HTML, CSS, JavaScript(JS)
⭕ 웹 구조 Web | 프론트엔드 개발 기술 목록: HTML, CSS, JavaScript(JS) ➡️ HTML: 구조 역할: 웹 페이지의 기본 구조를 제공함 기능: 제목, 문단, 표, 이미지, 동영상 등 페이지의 구조적 요소를 정의함 비유: 얼굴에서 눈, 코, 입과 같은 구체적인 부분을 형성함 ➡️ CSS: 스타일 역할: 웹 페이지의 시각적 스타일을 담당함 기능: 색상, 크기, 폰트, 레이아웃 등을 조정하여 콘텐츠의 시각적인 표현을 정의함 비유: 구조적으로 설정된 눈, 코, 입의 위치와 모양, 색상 등을 정의함 ➡️ JavaScript(JS): 동적 처리 역할: 웹 페이지의 동적 기능을 구현함 기능: 사용자의 입력에 반응하거나, 페이지의 콘텐츠를 실시간으로 변경하고 움직임을 추가함
2024. 4. 22.