[CSS] 그라데이션(그라디언트) 줄 있는 것 처럼 보이는 문제 해결
이런 문제 있는 분들 많을 것 같은데 생각보다 검색 결과가 없어서 찾기 힘들었다. 결국 직접 스택오버플로우에 물어봤고, 답변을 공유하고자 한다. 그라디언트를 당연히 마지막은 투명도를 0으로 줘서 자연스럽게 배경에 흡수되는 그라디언트를 만들려고 했는데 이상하게 줄이 생긴 것 같은 착시 효과를 주더라. 보통 짜는 코드처럼 단순하게 그라디언트를 설정하면 아래와 같이 보여진다. div.gradient_wrap { margin: 100px; width: 300px; height: 300px; background: linear-gradient(0deg, rgba(38,38,38,1) 0%, rgba(255,255,255,0) 100%); } 이 느낌을 없애주기 위해서는 아주 섬세한 그라디언트 컨트롤이 필요하다. 아..
Basic_Studies/CSS
2022. 7. 14. 16:47
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- nuxt 공식문서
- 파이썬 flask
- NextJS
- getserversideprops redirect
- 백준 10989 파이썬
- 글래스모피즘 애니메이션 구현
- react router
- nextjs 스크롤
- 파이썬 정렬
- Til
- 자바스크립트
- 화이팅
- nuxt 공식문서 한글
- 파이썬 크롤링
- 리액트
- 카페음료테스트
- vscode venv
- dvd 효과
- 리액트 라우터
- css marquee
- css 글래스모피즘
- 움직이는 글래스모피즘
- next.js 리다이렉트
- 10989 파이썬
- nextjs 파라미터 넘기기
- 리액트 스크롤
- bs4 크롤링
- 리액트 파라미터 넘기기
- 리액트 컴포넌트
- 글래스모피즘 구현
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함