난 즐거워... 개발이...

  • 홈

Frontend/CSS & SCSS & SASS 1

px을 em, rem으로 변경하는 법 ( feat. sass:math )

- PX Pixel 은 대게 absolute lenth ( 절대 길이 ) 라고 부른다. -> 다른 요소들의 크기와 상관없이 동일한 값을 가진다. ( 화면 해상도에 따라 다를 수 있음. ) but. px을 사용하게 되면 사용자의 글꼴 크기 설정을 무시해버리는 상황같은 심각한 문제를 일으킬 수 있다. 보통 브라우저의 default 사이즈는 16px이다. px을 사용하게 되면 모든 브라우저 설정값들을 덮어쓰기때문에, 루트 글꼴 크기는 무시하는 상황이 발생하여 개발자, 사용자가 원하지 않는 문제가 있는 UI가 만들어질 수 있다. 이러한 것들을 방지하고자 rem, em 단위를 사용한다. - REM 브라우저의 root 글꼴 크기의 배수를 적용. ex) root 글꼴 크기가 16px인 경우. 16px = 1rem ..

Frontend/CSS & SCSS & SASS 2023.05.16
이전
1
다음
프로필사진

난 즐거워... 개발이...

강아지 발 아니고 개발입니다.

  • 분류 전체보기 (20)
    • 알고리즘 (11)
      • 백준 (9)
      • SW Expert Academy (2)
    • Frontend (9)
      • React (0)
      • Javascript & Typescript (0)
      • CSS & SCSS & SASS (1)
      • Apache Echarts (4)
      • React-slick (2)
      • Recoil (1)
      • react-window (1)

Tag

apache, react, 대규모 데이터, react-slick-slider, apace echarts, px2rem, Chart, react-window, react-virtualized, px2em, echarts, line chart, react-slick, slick-slider, useEffect, Apache Echarts, selectorFamily, Carousel, TypeScript, echart,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

  2025. 06  
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.