5월13일 프로젝트 5일차

임동현·2022년 5월 16일
0

1일차

목록 보기
5/8

오전중 회의는 반응형에 알맞은 rem 설정을 하기로 했으며 사전에 픽셀로
고정값을 주기보단 % 로 전체적인 구간을 나눠두고 작업을 시작하기로 했다.

처음에는 화면이 줄어들었을땐 고정으로 되어있다 보니... 크기에 맞게 작아지는게 아닌 고정으로 서있는 것 처럼 보였다.

globalstyles 에

import { css } from "@emotion/react";

export const globalStyles = css`
  /* * {
    margin: 0px;
    box-sizing: border-box;
    font-family: "NotoSansKR", "Roboto";
  } */

  html {
    width: 100%;
    min-width: 100%;
    min-height: 100%;
    height: 100%;
    font-size: 62.5%;
    margin: 0;
  }
  /* ::-webkit-scrollbar {
    width: 0.4rem;
  }

  ::-webkit-scrollbar-thumb {
    height: 5%;
    background: skyblue;
    border-radius: 4px;
  }

  ::-webkit-scrollbar-track {
    background: #f2f2f2;
  } */

  @font-face {
    font-family: "NotoSansKR";
    font-style: normal;
    src: url("/fonts/NotoSansKR-Regular.otf") format("opentype");
    unicode-range: U+AC00-D7A3;
  }

  @font-face {
    font-family: "Roboto";
    font-style: normal;
    src: url("/fonts/Roboto-Regular.ttf") format("truetype");
    unicode-range: U+0041-005A, U+0061-007A, U+0030-0039;
  }

을 입력후 10px => 1rem 으로 수치를 환산하고 전체적인 px 값을 변경하기로 했다.

오늘도 여지없이 퍼블리싱 열심히 해서 다음주 부터는 빠르게 기능을 넣고싶다.

profile
프론트엔드 공부중

0개의 댓글