728x90 반응형 box-shadow2 [CSS] filter:drop-shadow()와 box-shadow의 차이점 둘 다 그림자 효과를 준다는 공통점이 있지만 요소에 적용되는 범위가 다르다. box-shadow: 요소의 상자에 그림자를 추가하여 뒷면에 그림자 효과를 생성합니다. filter: drop-shadow(): 요소 전체에 드롭 셰도우 효과를 적용하며, 이는 요소의 상자에만 국한되지 않고 내부의 투명하거나 반투명한 부분에까지 확장됩니다. div { display: flex; width: 50px; height: 50px; border: 1px solid gray; margin: 1rem; align-items: center; justify-content: center; } .drop {filter: drop-shadow(0 0 5px rgba(0,0,0,.5));} .box {box-shadow: 0 0 5p.. 2023. 11. 28. [HTML/jQuery] input에 포커스 되면 value 지우기 input에 포커스가 되면 값을 초기화하는 코드이다. onfocus 이벤트를 통해 쉽게 활용할 수 있다. click이 아닌 focus 이벤트라서 인풋에 클릭을 하거나 키보드를 통해 접근하면 동작한다. 포커스하면 지정한 값을 넣는 이벤트도 같이 넣었다. 화려한 무지개 색의 box-shadow 스타일링도 괜히 해봄,, See the Pen Clear input value on focus by nah (@wimmwell) on CodePen. 2023. 1. 19. 이전 1 다음 728x90 반응형