Doo can do it

  • 홈
  • React
  • SQL
  • 태그
  • 방명록

tailwind image 1

React tailwindCSS image

사이드 프로젝트를 하면서 tailwind를 사용하여 이미지를 처리하려는데 이미지가 늘어난 것 처럼 보이는 현상이 발생했다.한 눈에 보기에는 큰 차이가 없어보이지만 이미지가 찌그러진것 처럼 보였기 때문에 크기와 위치는 그대로 고정하면서이미지의 원본크기를 유지하는 방법이 뭐가 있을까 하여 알아본 결과로 tailwind 공식문서에 다양한 옵션들이 있었다.object-cover컨테이너를 덮도록 요소의 콘텐츠 크기를 조정할 수 있음object-contain컨테이너 내에 포함되도록 요소의 콘텐츠 크기를 조정할 수 있음object-fill요소의 내용을 늘려서 컨테이너에 맞출 수 있음object-scale-down컨테이너 크기에 맞게 크기를 줄일 수 있음object-none컨테이너 크기를 무시하고 요소의 콘텐츠를 원래..

리액트 2024.12.25
이전
1
다음
더보기
프로필사진

Doo can do it

  • 분류 전체보기 (118)
    • SQL (4)
    • 코드 (5)
    • TIL (43)
      • 내일배움캠프 2주차 (5)
      • 내일배움캠프 3주차 (4)
      • 내일배움캠프 4주차 (4)
      • 내일배움캠프 5주차 (3)
      • 내일배움캠프 6주차 (4)
      • 내일배움캠프 7주차 (4)
      • 내일배움캠프 8주차 (2)
      • 내일배움캠프 9주차 (2)
      • 내일배움캠프 10주차 (5)
      • 개인 TIL (5)
    • WIL (8)
    • 리액트 (29)

Tag

html, find, NestJS, js 비동기처리, 자바스크립트, map, 에러핸들링, react 무한스크롤, teamproject, node.js, bcrypt, RDBMS, TCP, for 반복문, js 배열함수, javascript, AWS, Typescript, useInfiniteQuery, Nest.js,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/05   »
일 월 화 수 목 금 토
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 31

방문자수Total

  • Today :
  • Yesterday :
GitHub

Copyright © Kakao Corp. All rights reserved.

티스토리툴바