2022 05 03 CSS

hongwr·2022년 5월 2일
0

CSS

목록 보기
11/12
post-thumbnail

CSS

line-height

line-height 속성은 line-box 의 높이를 지정한다.

주로 텍스트간의 줄 간격을 조절할 때 사용한다.

아이콘, 이미지, 글 등을 일정한 크기의 안에 넣을 때 가운데 정렬을 할 때도 사용이 가능하다.

물론 가운데 정렬이 의미가 되는 건 아니지만 line-height를 사용하여 박스의 높이와 같게 사용하게 되면 가운데로 들어가게 된다.

.major__icon {
  width: 170px;
  height: 170px;
  line-height: 170px;
  font-size: 70px;
  color: var(--color-blue);
  margin: auto;
  border: 1px solid var(--color-blue);
  border-radius: 50%;
  margin-bottom: 16px;
}


아이콘을 원 안에 가운데로 넣고 싶어서 사용. 원래는 맨 위에 붙는다.

opacity

투명도.

케러셀 슬라이드를 만들 때도 사용했던 것.

투명하게 만들어 뒤에를 보이게 만들 수도 있음.

translateY

transform: translateY

2D 평면에서 요소를 수직으로 재배치합니다.

https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateY

profile
코딩 일기장

0개의 댓글