본문 바로가기

전체 글

 (42)
05 - 18 ui 개발 기본기 준비 8 양수로 계산할 때는 열 기준 맨 왼쪽부터 1,2,3,4,5 음수로 계산할 때는 열 기준 맨 오른쪽부터 -1,-2,-3,-4,-5 이런 식이다. ( 이는 row, 즉 행도 마찬가지 ) https://www.youtube.com/watch?v=DsrhJV0mfL0 grid-column-end의 값이 2번이었던 이유. 맨 왼쪽에서부터 1번 2번 이런 식으로 되어있기 때문에 5번째 열부터 시작해서 2번째 열에서 끝난다. 그래서 값이 2번이었던거임 ( 해결완료 ) grid-column-end: span 2; ( 그리드의 넓이를 2만큼 넓히겠다. ) grid-column-end: 4; 와 똑같은 값. span -> 열의 넓이 값으로 지정할 수 있게 해줌 ( 그래서 양수만 해당 가능 ) * 일단 9단계 까지. ( 추..
05 - 18 ui 개발 기본기 준비 7 * CSS 미디어쿼리는 어떤 역할을 수행하는지 서술하라. -> 미디어쿼리(mediaqueri)는 사이트에 접속하는 장치에 따라 특정한 CSS 스타일을 사용하도록 도와주는 소프트웨어 모듈이다. 미디어 쿼리를 이용한 사이트는 웹 사이트에 접속하는 기기에 따라서 레이아웃이 바뀌게 된다. 즉, PC로 접속하면 모니터 화면에 맞게 스마트폰으로 접속하면 스마트폰에 맞게 레이아웃이 변형되는 것. 웹 문서의 스타일을 정의할 때, 즉 CSS 코드를 작성할 때 미디어쿼리 모듈을 사용해 주는 것이 일반적인 사용 방법이다. * 미디어 쿼리를 작성하는 방법에 대해서 서술하라. -> 미디어 쿼리는 @media 속성을 사용해 특정 미디어에서 어떤 CSS를 적용할 것인지 지정해준다. @media screen and ( min-wid..
05 - 17 ui 개발 기본기 준비 ( 6 ) * px em과 rem의 차이는 무엇인가? -> 절대적인 유닛엔 px, 상대적인 유닛엔 퍼센트과 뷰포트와 관련된 em과 rem을 사용한다. 부모 요소에 사이즈에 따라 사이즈가 변경이 되어야한다? %나 em 부모와는 상관없이 브라우저 사이즈에 대해서 반응해야 된다면 v*(뷰포트)나 rem등을 사용하면 된다 ( ex 반응형 ) em과 rem의 차이는? em과 rem은 어떤게 더 낫다는 개념은 없고 디자인에 따라서, 정확하게 원하는 기능이 무엇인지에 따라서 em을 써야될 때가 있고 rem을 써야될 때가 있다. 좋아요 라는 버튼의 컴포넌트를 만든다고 하면 rem -> relative to root element ( 루트요소에 의해 크기가 결정된다는 뜻 ) em, rem -> 상대단위 = 고정되지 않고 어떤 기준..

티스토리툴바