# line height

10개의 포스트
post-thumbnail

가로 가운데 정렬은 text-align: center, 그럼 세로 가운데 정렬은?

검은색 상자 안에 Hello World 내용을 가지는 <div>를 작성한다.해당 요소를 가운데(가로) 정렬하기 위해서 text-align: center;를 부여한다.현재 검은 박스의 height 값은 250px이다. Hello World에 line-height값을

2022년 5월 24일
·
0개의 댓글
post-thumbnail

2022 05 03 CSS

line-height 속성은 line-box 의 높이를 지정한다.주로 텍스트간의 줄 간격을 조절할 때 사용한다.아이콘, 이미지, 글 등을 일정한 크기의 안에 넣을 때 가운데 정렬을 할 때도 사용이 가능하다.물론 가운데 정렬이 의미가 되는 건 아니지만 line-heigh

2022년 5월 2일
·
0개의 댓글
post-thumbnail

2022. 04. 26 CSS

블럭레벨의 태그를 사용할 때 수평 가운데로 넣고 싶다면 margin:auto를 사용하면 된다.text 말고 다른 정렬을 할 때도 많이 쓴다.center를 이용하면 가운데 정렬이 가능하지만 블록레벨의 태그에 적용하면 되지 않는다이럴 때는 margin: auto를 이용해야

2022년 4월 25일
·
0개의 댓글
post-thumbnail

CSS font

!youtubei464e6k4rPEfont-family는 서체를 보호하는 속성입니다. 같은 방법으로. h1{ font-family: "Times New Roman", Times, serif;}위 코드의 의미는 h1 Times New Roman을 시작합니다. 사용자

2022년 4월 22일
·
0개의 댓글
post-thumbnail

[CSS] 가운데 정렬하는 방법 모음

수평정렬만 가능하고, 수직 정렬은 불가능하다.예를 들어 div는 블록 레벨인데,margin이 오른쪽으로 기본적용되어있는 것을양쪽이 동일한 간격으로 자동으로 margin을 맞춰주는 것이기 때문이다.text외 다른 요소들을 가운데 정렬할 때도 쓰인다.div같은 경우는 블록

2021년 10월 21일
·
0개의 댓글
post-thumbnail

TIL - 08. button의 높이 차이

하나의 div안에 두 button을 나란히 가운데 정렬을 하다가 문제가 생겼다. 이렇게 봐서는 눈이 안좋은가 싶었지만 개발자도구로 자세히 들여다보니 확연히 차이가 났다. 분명 같은 div 안에 같은 class를 가지고 같은 속성을 적용했는데도 높이에 차이가 보이는

2021년 7월 7일
·
0개의 댓글
post-thumbnail

Design #2 TYPOGRAPHY

본 블로그의 포스팅 내용은 Udemy Vako Shvili의 "Complete Web Design: from Figma to Webflow to Freelancing" 강의 내용의 일부입니다.

2021년 5월 6일
·
0개의 댓글
post-thumbnail

CSS Trick 001 line-height

❓display:flex 선언없이 text를 정중앙에 놓고 싶다면? ❗line-height를 height와 같은 값으로 선언하면 된다.

2021년 3월 16일
·
0개의 댓글

큰 폰트사이즈의 글자 짤림 오류 해결

css에서 font-family로 동일한 font-size를 적용했을 때, 서로 다른 높이값을 가지게 된다. 각 폰트 자체가 갖고 있는 다른 매트릭스로 인해 높이값이 다르게 된다. 이전까지만 해도 글자가 위아래로 짤릴 경우, line-height: 1.0이나 line-height: 1.5 등의 값을 적용하면서 오류를 수정하곤 했다. 하지만 출처에 명시한 아...

2019년 9월 19일
·
0개의 댓글