[CSS] selectBox 화살표 바꾸기
·
과거의 이력/HTML_CSS
selectBox 화살표 디자인을 없앤 후, 내가 원하는 svg 이미지를 배경으로 설정하는 방식으로 변경할 수 있다. 1. selectBox 화살표 없애기 selectbox style에 해당값을 부여하여 디자인 속성을 없앤다. appearance:none; 2. 화살표 svg 이미지 삽입하기 background 속성으로 화살표 이미지를 추가한다. 이미지는 url로 삽입하며 상대경로를 활용하여 이미지 경로를 추가한다. 아이콘 반복형식으로 배경이 지정되지 않도록 no-repeat 속성을 함께 부여한다. 또한 아이콘 위치 및 크기를 함께 정의하면 끝! background:url('../icon/my-arr.svg') no-repeat 97% 50%/20px;
[CSS] shadow가 안보일때 요소 앞으로 꺼내기
·
과거의 이력/HTML_CSS
button태그에 box-shadow 속성이 하위 HTML 요소에 가려지는 현상 개선하기 1. 문제현상 상위 버튼이 하위 요소에 의해 shadow가 가려진다. 2. 트러블슈팅 두가지 속성을 shadow 속성이 부여된 요소에 추가한다. position: relative; z-index: 1;