< Code diaries />

📌 CSS Overflow 관련 속성 정리 (표)속성설명주요 값비고overflow넘친 콘텐츠 처리 방식visible, hidden, scroll, auto기본값 visibleoverflow-x가로(수평) 방향 오버플로우visible, hidden, scroll, auto수평 스크롤 여부 결정overflow-y세로(수직) 방향 오버플로우visible, hidden, scroll, auto수직 스크롤 여부 결정overflow-wrap단어가 넘칠 경우 줄 바꿈 처리normal, break-word, anywhereword-wrap과 유사overflow-anchor스크롤 위치 자동 조정 방지auto, none레이아웃 변경 시 자동 스크롤 방지text-overflow텍스트가 넘칠 때 표시 방식clip, elli..

🚀 PascalCase vs camelCase 차이점 정리✅ 둘 다 여러 단어를 이어 붙여 네이밍할 때 사용하는 방식이지만, 첫 글자의 대소문자가 다름✅ 사용되는 곳이 다름 (클래스 vs 변수, 함수 등) ✅ PascalCase란?✅ 각 단어의 첫 글자를 대문자로 시작하는 표기법✅ 공백 없이 모든 단어를 연결✅ 주로 클래스(Class), 생성자 함수(Constructor), 타입(Type)에서 사용됨 class Person {} // ✅ 클래스 이름function Animal() {} // ✅ 생성자 함수type UserData = {} // ✅ TypeScript 타입  ✅ camelCase란?✅ 첫 단어는 소문자로 시작하고, 이후 단어의 첫 글자만 대문자로 작성✅ 일반적인 변수, ..

오늘  HTML 소스에서 data-* 속성을 적는다.text  CSS에서 attr() 을 이용하여 불러들일 수 있다.attr()은 content에서만 사용할 수 있으며, 동적으로 요소의 속성 값을 가져올 수 있음.h1::after { content: attr(data-title); color: red; font-size: 16px;}// 결과 helloh1::before { content: "Prefix - " attr(data-title); font-weight: bold; color: blue;}// 결과 "Prefix - hello"h1::after { content: " (" attr(data-title) ")"; font-size: 14px; color: gray;}// 결과 (..