삼바의 성장 블로그

What are the advantages of using CSS preprocessors?CSS 전처리기를 사용할 때, 장점은 무엇입니까? 나의 답변CSS를 작성 할 때, 프로그래밍적 요소(변수, 함수, 상속)을 사용하여 도움을 주는 도구입니다. 추가 학습내용CSS preprocessor은 CSS를 좀더 촘촘하고 DRY 방법론에맞추어 개발할 수 있게 합니다.CSS preprocessor를 사용하여 유지보수가 쉽고 확장에 용이한 CSS를 만들 수 있게 됩니다. CSS preprocessor 장점재사용성: 공통 요소 혹은 반복적인 항목을 변수, 함수로 대체 가능합니다.시간적 비용 감소: 임의 함수 및 Built-in 함수로 인해 개발 시간적 비용을 절약할 수 있습니다.유지 관리: 중첩, 상속과 같은 요소로..

What is CSS BEM?CSS BEM은 무엇입니까? 나의 답변BEM(Block Element Modifier)은 CSS 아키텍쳐로 클래스명을 .block__element--modifier와 같은 형식으로 나타냅니다. 추가 학습내용CSS-in-JS의 scope문제를 해결하기 위한 대체 해결책다양한 CSS 구조를 개선시키기 위한 CSS 개발 방법론 예시Block문단 전체에 적용된 요소 혹은 요소를 담고 있는 컨테이너를 말합니다.Block의 이름은 그 블록의 목적으로 기술되어야 하며, 그 Block의 상태를 나타내지 않습니다.Block은 자신의 환경에 영향을 끼쳐서는 안됩니다. (Block의 positioning이나 margin 값과 같은 외부 기하학적 요소를 설정해서는 안됩니다.) → Block의 재사..

CSS Text 오버플로우 Overflow 할경우 대체할 텍스트 정하기 div.a { white-space: nowrap; width: 50px; overflow: hidden; text-overflow: clip; border: 1px solid #000000; } div.b { white-space: nowrap; width: 50px; overflow: hidden; text-overflow: ellipsis; border: 1px solid #000000; } div.c { white-space: nowrap; width: 50px; overflow: hidden; text-overflow: "----"; border: 1px solid #000000; } 한줄 혹은 여러줄을 남기고 자르는 경우 ..