Publishing 4

Css란[4]

타이포그래피란, 인쇄, 웹, 편집 디자인 등에서 서체와 글자 배치를 시각적으로 구성하고 표현하는 작업을 말합니다.🅰️ Font Size (글자 크기)✅ 단위 종류단위 설명px고정 크기 (브라우저 설정과 무관)em부모 요소를 기준으로 한 상대 크기rem루트 요소(html)를 기준으로 한 상대 크기em, rem은 가변 크기로 반응형 웹에 자주 사용됩니다.브라우저 기본 설정(보통 16px)에 따라 변경될 수 있습니다.🎨 Color (글자 색상)color: red;color: rgb(255, 0, 0);🧭 Text Alignment (정렬)속성 값 설명left왼쪽 정렬right오른쪽 정렬center가운데 정렬justify양쪽 정렬🅰️ Font 관련 속성✅ font-family (글꼴)font-family..

Publishing/Css 2023.04.15

Css란[3]

📌 선택자란?웹 페이지의 특정 요소를 선택하는 것을 선택자(selector)라고 합니다.주로 CSS, JavaScript, JQuery에서 사용되며,태그(Tag)IDClass등을 기준으로 요소를 찾고, 스타일 적용 또는 이벤트를 지정할 수 있습니다.📘 JQuery 기준 선택자 정리🔹 1. Tag 선택자"태그명"예:$("a")$("div")🔹 2. ID 선택자#아이디값예:$("#test")🔹 3. Class 선택자.클래스명예:$(".test")🔹 4. 직계 자손 선택자"부모 > 자식"예:$("ul > li")🔹 5. 모든 자손 선택자"부모 자식"예:$("div span")🔹 6. 전체 선택자*예:$("*")🔹 7. 형제 선택자 (바로 다음 형제)"A + B"예:$("h1 + p")🔹 8...

Publishing/Css 2023.04.15

CSS란[2]

HTML 태그를 화면에 어떤 방식으로 보여줄 것인지를 결정하는 속성입니다.1. 📦 Box Model (박스 모델)HTML 요소는 기본적으로 박스 형태로 렌더링되며, 대표적인 Display 유형은 다음과 같습니다:Block한 줄 전체를 차지함예: , , , 등width, height 지정 가능Inline내부 콘텐츠 크기에 맞게만 영역을 차지함width와 height 속성 적용 불가예: , , 2. 📌 Position 속성요소의 배치 방식(위치)을 지정합니다.속성설명static기본 위치 (흐름 그대로 배치됨)relative요소 자신을 기준으로 top, left 등 위치 조정absolute가장 가까운 position 지정 부모 요소를 기준으로 절대 위치 지정fixed화면 기준으로 고정, 스크롤에도 위치 ..

Publishing/Css 2023.04.15

CSS란[1]

CSS (Cascading Style Sheets)는 HTML 문서에 디자인(스타일)을 적용하기 위해 별도로 개발된 스타일 언어입니다.📌 HTML에 CSS 적용 방법Inline 방식Hello WorldInternal 방식 (Style 태그 사용)Hello WorldExternal 방식 (CSS 파일 분리)🎯 CSS 선택자란?HTML에 명시된 Tag, ID, Class 등 특정 요소를 선택하여 스타일을 지정하는 문법입니다.선택자를 활용하면 다음과 같은 요소를 타겟팅할 수 있습니다:부모/자식첫 번째/마지막 요소특정 위치 (n번째) 등📂 선택자 종류🔸 Tag 선택자ul { list-style: none;}table { border-collapse: collapse;}🔸 ID 선택자#header {..

Publishing/Css 2023.04.15