Notice
Recent Posts
Recent Comments
Link
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
Tags
- summary
- mysql if
- ApexChart
- 스크롤 이벤트
- 셀렉트박스 커스텀
- 앵귤러 모달
- angular route
- 옵저버블
- ajax 사용 예시
- prisma
- 검색
- 모달
- flex-1
- 앵귤러 애니메이션
- angular animation
- Angular Router
- angular modal
- scroll
- formgroup
- modal
- Router
- route
- 스크롤 이벤트 감지
- 아이오닉 스크롤 이벤트
- angular button
- Oracle LISTAGG 사용 예시
- 호버
- Ionic modal
- TAILWIND
- egov spring ajax 사용 예시
Archives
- Today
- Total
목록Tailwind 배경이미지 (1)
깜놀하는 해므찌로
Tailwind background image cover 배경 이미지 커버 활용 예시 / VW / VH
1. 이미지 경로 기본 슬래시 / 사용2. screen 속성은 vh, vw 수치를 결정한다. 현재 스크린의 max-w : vw="100" 배경이미지 콘텐츠 3. z-index 를 활용하여 배경이미지와 콘텐츠를 따로 관리하기도 합니다. (div) 4. img 태그 하나로도 대체할 수 있습니다.5. object-cover : 해당 속성이 없으면 이미지가 늘어나거나 깨지지 않고 깔끔하게 채워집니다.6. pointer-events-none : 마우스 드래그를 막습니다. 이미지 태그에 웬만하면 넣는 것을 추천드려요 https://tailwindcss.com/docs/object-fit Object Fit - Tailwind CSSUtilities for controlling how..
IT
2023. 5. 15. 12:20