| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
Tags
- useAppDispatch
- webpack
- RTK Query
- 무한 스크롤
- Jest
- 공변성
- Cypress
- 호이스팅
- CI/CD
- dfs
- CORS
- Promise
- 결정 알고리즘
- autosize
- 투포인터
- 인터섹션
- 타입 좁히기
- app router
- ESlint
- 리터럴 타입
- React
- async/await
- recoil
- tailwind
- 반공변성
- 이분 검색
- SSR
- TS
- 태그된 유니온
- map
Archives
- Today
- Total
짧은코딩
box-shadow, overflow-x 본문
반응형
box-shadow
그림자 속성을 줄 수 있다.
이 사진 밑쪽 처럼 그림자를 줄 수 있다. 원하는 방향 어디든 줄 수 있다.
box-shadow: 0px 5px 5px -5px rgba(0, 0, 0, 0.4);이렇게 사용할 수 있다.
-참고 사이트
https://developer.mozilla.org/ko/docs/Web/CSS/box-shadow
box-shadow - CSS: Cascading Style Sheets | MDN
box-shadow CSS 속성은 요소의 테두리를 감싼 그림자 효과를 추가합니다. 쉼표로 구문해서 여러 그림자 효과를 입힐 수 있습니다. 박스 그림자는 요소에서의 수평수직 거리(오프셋), 흐릿함과 확산
developer.mozilla.org
overflow-x
overfolow-x는 아이템의 범위가 넘치면 스크롤을 만들거나 안보이게 하는 등의 속성을 줄 수 있다. overflow-y로도 사용이 가능하다.
이렇게 아이템이 넘치는 경우 스크롤이 가능하다.
overflow-y: auto;코드에서는 이 코드를 사용했다.
-참고 사이트
https://developer.mozilla.org/ko/docs/Web/CSS/overflow
반응형
'HTML, CSS' 카테고리의 다른 글
| text-overflow(글자 넘치면 사용), filter(이미지 어둡게 만들기) (0) | 2022.07.15 |
|---|---|
| box-sizing (0) | 2022.06.28 |
| 드림코딩-유튜브 페이지 만들기(드디어 안보고 완성) (0) | 2022.05.28 |
| 드림코딩-유튜브 페이지 만들기(실패 ㅠㅠ) (1) | 2022.05.22 |
| 반응형 헤더 안보고 만들기 (0) | 2022.05.15 |
'HTML, CSS' Related Articles
more
Comments