dev/HTML CSS7 [CSS] overflow 카드 UI를 하다보니 넘치는 텍스트를 말줄임으로 감싸거나 인기 상품의 경우 좌우로 넘어가는 스크롤을 만드는 등 곳곳에서 overflow의 역할이 있다는것을 알게 되었다. 이번 블로그 글에선 overflow의 속성값들과 관련 css 속성을 같이 살펴보려고 한다. 🤔 overflow overflow 속성이 효력을 갖기 위해선 반드시 블록 레벨 컨테이너 높이 (height 또는 max-height)를 설정하거나, white-space를 nowrap으로 설정해야 합니다. * white-space 는 아래 관련 속성으로 더 자세히 살펴보겠습니다. visible overflow에 속성을 별도로 명시해주지 않을때 적용되는 기본 속성값입니다. visible은 다른 속성값들과는 다르게 주어진 공간보다 컨텐츠가 더 큰 경.. 2023. 3. 9. [CSS]선택자 결합자, 가상(의사) 클래스, 가상(의사) 요소 이번 블로그 글은 선택자에 관한 내용을 정리해 보려한다. 지극히 내가 보기 위한 글이므로 기본선택자(클래스, 타입, 아이디, 전체) 를 제외한 그 외에 것들을 적어내려가보겠다 결합자 자손 선택자 ( ) 자손선택자는 내 밑의 모든 후손을 전역 선택할때 쓰는 선택자이다. 사용법은 조상과 자손 사이에 공백을 두면서 사용하면 된다. 자손 선택자는 바로 하위에 있는 자손을 선택하지 않아도 된다. 자식손자 자식손자 자식 선택자 ( > ) 자식선택자는 내 바로 밑의 자식을 선택할 때 쓰는 선택자이다. 자손선택자와는 다르게 바로 밑의 자식만 선택할 수 있으며 자식 이후 후손은 선택하지 않는다. 자식손자 자식손자 ✅ 자손과 자식 선택자의 가장 큰 차이점은 전역으로 선택할 수 있는지의 여부이다. 인접 형제 선택자 ( + .. 2023. 3. 5. [HTML/CSS] 단위 공부 CSS를 접하다 보면 크기를 지정하는 단위를 많이 사용하게된다. 웹디자인을 할당시 주로 px(필셀) 단위와 폰트 크기를 결정하는 pt(포인트)를 주로 사용했는데 이런 단위는 '절대 길이 단위'로 인쇄할때 주로 이용되는 단위라고 한다. 다양한 디바이스가 존재하고 pc, 모바일, 태블릿 등 반응형 사이트에서 절대 길이 단위는 사용을 권장하지 않는다고 하는데.. 개발할땐 어떤 단위를 주로 사용해야 하는걸까? 🤔 절대 길이 단위 절대 길이 단위에는 cm, mm, in, pc, pt, px 등 다양한 단위가 있지만 주로 사용하는 px 만 살펴보겠습니다. px은 디바이스 화면에서 이미지를 표현하는 가장 작은 단위 입니다. 또한 고정된 값이라 직관적으로 쉽게 사용할 수 있다는 장점이 있습니다. 단, 개발시 px 사용.. 2023. 3. 4. 이전 1 2 다음
