daily-inklings

2025년 js를 대체하는 새로운 css기능들  Live Validation vs Late Validation Example Live Validation Enter your name (required): This field is required. Late Validation Enter your email (required): Please enter a valid email address. HTML CSS JavaScript Python Live Validation Enter your name (required): This field is required. Late Validation Enter your email (required): Please enter a valid email address. CSS 스타일 쿼리(style queries) 설명 및 예제 스타일 쿼리란? 스타일 쿼리는 특정 요소의 부모 컨테이너 스타일(예: CSS 속성 값 또는 커스텀 속성 값)을 기반으로 하위 요소에 조건부 스타일을 적용할 수 있는 기능입니다. 이는 컨테이너 크기 쿼리와 유사하지만, 크기 대신 스타일 속성을 기준으로 작동합니다. 현재는 CSS 커스텀 속성(`--variable`)만 지원되며, 실험적인 기능으로 일부 브라우저(예: Chrome)에서만 사용 가능합니다. 사용법 `@contai...

 퍼플렉시티 관련 정보 맥에서 퍼플렉시티를 실행시 문제점. 맥에서 퍼플렉시티를 실행시 문제점.

  블로그스팟 게시물갯수 조절팁 기본 메인화면에 타이틀 외에 내용이 노출되게 않게 하는 방법 브레이크 타임을 맨상단에 삽입 기본 메인화면에 내용을 요약해서 보여지게 노출하는 방법 (2~3줄만 노출) 브레이크타임을 화면에 보여지는 글자수 내에 삽입 추가로 계속 업데이트 될 예정 ● ● ●

   px  -> rem  변경 자주 쓰는 사이즈 16px-> 1rem 기준 12px -> 0.75rem 13px ->0.8125rem 14px ->0.8750rem 15px -> 0.9375rem 16px -> 1.000rem 17px -> 1.0625rem 19px -> 1.1250rem 20px -> 1.1875rem 21px ->1.2500rem 22px -> 1.3750rem 23px -> 1.4375rem 24px -> 1.5000rem 25px -> 1.5625rem 26px -> 1.6250rem 27px -> 1.6875rem 28px -> 1.7500rem 29px -> 1.8125rem 30px -> 1.8750rem 31px -> 1.9375rem 32px -> 2.0000rem

HTML CSS JavaScript Python .two-line-text { display: -webkit-box; /* Flex 컨테이너처럼 동작 */ -webkit-box-orient: vertical; /* 축 방향 설정 */ overflow: hidden; /* 넘치는 텍스트 숨김 */ -webkit-line-clamp: 2; /* 최대 2줄 표시 */ line-height: 1.5; /* 줄 간격 조정 */ max-height: calc(1.5em * 2); /* 총 2줄 높이 */ text-overflow: ellipsis; /* 말줄임표 추가 */ }