공들여 쓴 글에 제목을 달고 모바일에서 열어봤는데, 마지막 줄에 짧은 단어 하나만 덩그러니 남아 있는 걸 보신 적 있으신가요? 😅 글꼴도 크기도 잘 골랐는데 제목이 어딘가 엉성해 보이는데요. 한국어라면 여기에 더해 "브라우저"가 "브라" / "우저"로 뚝 잘리는 일까지 생깁니다. 이런 문제는 글꼴이나 여백을 아무리 만져도 해결되지 않습니다. 줄을 어디서 나눌지는 브라우저의 줄바꿈 알고리즘이 정하는 영역이기 때문인데요. 우리가 개입하려면 그 알고리즘에 직접 말을 걸어야 합니다. 이번 포스팅에서는 word-break 속성과 text-
아무리 웹에서 이미지나 비디오의 비중이 커지더라도 텍스트는 웹에서 빠질 수 없는 핵심적인 구성 요소인데요. 이번 포스팅에서는 웹에서 텍스트를 스타일하기 위해서 자주 사용되는 대표적인 CSS 속성을 정리해보겠습니다. 텍스트 색상: color CSS에서 정말 자주 사용되는 color 속성은 텍스트 색상을 지정하는데 사용됩니다. color 속성에는 여러 가지 타입의 값을 설정해줄 수 있는데요. 예를 들어, blue와 같은 명명된(named) 색상, #ff0000와 같은 색상 코드, 그리고 rgb(), hsl()과 같은 색상 함수도 사용할
Material UI는 현재 가장 많이 쓰이고 있는 React UI 컴포넌트 라이브러리 중에 하나입니다. 많은 React UI 컴포넌트 라이브러리는 기존에 있는 CSS 라이브러리를 기반으로 만들어지는 경우가 많습니다. React Bootstrap이 대표적인 예인데요. 이러한 React 라이브러리는 근간이 되는 CSS 라이브러리에 대한 이해나 경험이 없는 경우 여러모로 사용하기 불편한 경우가 많습니다. 하지만 Material UI는 여타 React UI 컴포넌트 라이브러리와 달리 처음부터 React로 만들어졌기 때문에 많은 개발자들에