릴리코더의 골방 릴리코더의 골방

언어/CSS

• [CSS] 여러 줄에서의 말줄임

  언어/CSS 2022. 9. 27. 15:14

  .product__caption { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; } 여러줄일 때 말 줄이기 -webkit-line-clamp에 말줄임을 시작하고 싶은 줄 수를 입력하면 된다.

  Read More
• [css] float 속성

  언어/CSS 2022. 9. 10. 00:08

  float는 한 요소가 보통 흐름으로부터 빠져서 텍스트 및 인라인 요소가 부모요소를 기준으로 자기 컨테이너의 좌우측을 따라 배치된다. HTML 태그에 float 속성을 따로 지정하는 것이 아니라면 float:none이 기본값이다. 자동적으로 왼쪽에 정렬된다고 해서 float:left가 아니다. 자식요소에 float 속성이 있다면 부모는 자식요소가 없다고 판단해 높이값을 잃는다. 이 때 부모에게 overflow: hidden 속성을 지정하면 자식의 높이에 자동으로 맞추어 줌 float 속성이 적용되면 다음 요소(형제 요소)가 float 속성을 상속받기 때문에 clear 속성을 주어서 해제시켜야 한다. float로 카드 모양 만들어보기 See the Pen Untitled by gaeun (@gaeundev..

  Read More