티스토리

믹아의 개발일기
검색하기

블로그 홈

믹아의 개발일기

mik-a.com/m

개인 공부 블로그

구독자
2
방명록 방문하기

주요 글 목록

  • CSS 애니메이션 성능 최적화하기 애니메이션 공부하면서 알게된 내용 정리 웹 브라우저는 위의 이미지와 같은 로딩, 렌더링 순서를 거친다. 이 중 Layout, Paint, Composite 단계에 주목하자 3. Layout 브라우저에서 엘리먼트의 도형, 위치를 생성한다. 대표적인 속성값으로 width, height, margin, padding, left,top,rigth,bottom 등이 있다 4. Paint 각 엘리멘트의 픽셀을 채운다. box-shadow, border-radius, color, background-color 등이 있다. 5. Composite 화면에 모든 레이어를 그리기 시작한다. transform, opacity 가 있다. 여기서 만약 width, height 등의 값 (Layout 에 해당하는 속성 값)을 애니.. 공감수 1 댓글수 8 2021. 4. 7.
  • [CSS] html a 태그 하이퍼링크 색깔 바꾸기 구글 크롬에서만 작동 확인.. a 태그에 하이퍼링크를 달았을 때 기본값은 파란색(#0000EE) , 한번 누른적이 있다면 보라색(#551A8B)으로 뜬다. 기본값을 바꿔보자. /* style.css */ :link { color: #0000EE; } :visited { color: #551A8B; } link 가 링크 방문전 색이고, visited 가 방문한 적이 있는 링크다. 공감수 1 댓글수 21 2020. 4. 13.
  • [CSS] HTML Video Controls 버튼, 아이콘 숨기기 Google Chrome 에서 동작 비디오 태그에 controls 라는 옵션을 주면 밑에 비디오를 컨트롤하는 UI가 띄워진다. 근데 내가 필요 없는, 숨겨야 하는 버튼이 있는 경우 숨길 수 있다. (전체화면, 재생 등) /* style.css */ /* 숨기려는 버튼을 골라서 쓰자 */ /* 전체화면 버튼 */ video::-webkit-media-controls-fullscreen-button {} /* 일시정지, 재생 버튼 */ video::-webkit-media-controls-play-button {} /* 재생 슬라이드..? */ video::-webkit-media-controls-timeline {} /* 현재 진행 시간 */ video::-webkit-media-controls-curre.. 공감수 7 댓글수 15 2020. 3. 31.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

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

    © Kakao Corp.