frontend

💋 글자색에 그라데이션 적용하기 위의 사진에서 '짝크루를 연결해 드려요.'처럼 왼 ⇒ 오로 갈 수록 그라데이션 하기 위해서는, 찾아보니 글자 자체에 그라데이션 넣는 방법은 없는 것 같다. ⇒ 배경색에 그라데이션을 넣고 글자 자체를 투명하게 뚫는 방법으로 구현할 수 있다. .gradation { background: linear-gradient(to right, $leftColor, $rightColor); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } 위의 세 옵션 적용하면 된다. 💋 이미지에 그라데이션 적용하기 내가 가진 사진은 이거다. 그리고 이미지 우하로 갈수록 그라데이션해서, 아래와 같이 약간 fade out 느낌을 ..

💋 단위 ✔️ % %는 부모 요소 기준으로 적용된다. 부모에 padding 있으면 그 영역은 빼고 %를 때려서 계산함 max-width 와 함께 자주 사용한다. Relative to the parent element ✔️ em & rem em 가장 근접한 상위 요소의 폰트 사이즈의 몇 배인지를 기준으로 정하는 단위 상위 요소의 폰트 사이즈가 24px인 경우, 하위의 2em은 48px이다. 상위 요소의 폰트 사이즈에 따라서 변화하기 때문에 초보자(=깃짱)에게는 조금 어려울 수 있다. Relative to the font-size of the element (2em means 2 times the size of the current font) rem root를 기준으로 하는 em 여기서 root는 최상위 요..