티스토리

TL&D
검색하기

블로그 홈

TL&D

tozoku.net/m

컴퓨터, 프로그래밍, 블록체인, S/W, A.I, Python, JavaScript

구독자
21
방명록 방문하기
공지 Tistory 초대장 10장 모두보기

주요 글 목록

  • SVG CSS로 색상 변경하기 svg 포맷을 이용한 이미지 파일의 색상을 변경하는 것에 대해 검색을 해보면 대부분이 svg 파일을 html에 작성해서 fill 또는 CSS를 이용해서 색상을 변경하라는 내용을 볼 수 있습니다. 하지만 그렇게 비효율적인 방법이라면 mdi같이 svg 포맷을 폰트로 만들어서 사용했을 듯 합니다. SVG 파일의 색상을 HTML 작성 없이 CSS만으로 변경하는 것은 의외로 매우 간단합니다. .svg-test { background-color: #eeeeee; -webkit-mask: url('image.svg') no-repeat center; mask: url('image.svg') no-repeat center; } 이런식으로 mask를 이용해서 image를 불러오고 background 색상을 변경 작업해주.. 공감수 3,435 댓글수 0 2021. 7. 26.
  • CSS 100%가 적용이 안될 때 CSS를 사용하다 보면 요소값에 % 적용을 하는경우가 상당수 많은데 100%를 이용해서 꽉차게하거나 혹은 div 등의 요소안에 다른 요소가없는데 사이즈를 가로는 되는데 세로사이즈가 안되는경우가 태반이다. 대처방안으로 display:table, display:table-row를 사용한다는데 이건 너무 부적절하다고 생각하고 우회방안으로 height:9999px; overflow-y:hidden; 이런 방식도 존재하지만 이방법또한 옳지않다. 대처방안으로 존재하는것은 바로 Viewport를 이용하는 것이다. vh와 vw가 있다. 1000px라는 값이 존재한다고 가정할때 1vh는 10px를 나타낸다. 100분의1이다. 상대적으로 뷰의 너비와 높이를 맞출수있다. 100%를 적용한다고 가정한다면 100vh를 이용하면.. 공감수 934 댓글수 0 2017. 1. 5.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.