주제 기반 전환 가능 Favicon
지금까지 SVG는 로고별 요구 사항에 가장 적합한 제품입니다.favicons도 마찬가지다.
SVG를favicon으로 사용하는 또 다른 장점은 동적favicon을 사용하여 사용자의 시스템 선호도(어두운 모드나 밝은 모드)에 따라 색을 변경할 수 있다는 것이다.너는 심지어 여러 개의 파일을 유지할 필요조차 없다.
SVG를 로드할 때 SVG 파일에서 인라인 CSS를 사용하여 색상을 동적으로 변경할 수 있습니다.사실 이 SVG는 프로젝트의 다른 곳에서 사용할 수 있습니다. 이 SVG는 동적이며, 별도의 변경 사항이 없습니다.
그것을 테스트하기 위해서 다음 SVG (동그라미만) 를 프로젝트에 저장하고favicon으로 HTML에 추가하십시오.
<link rel="icon" href="svgfile.svg" /><svg viewBox="0 0 350 350" version="1.1" xmlns="http://www.w3.org/2000/svg" width="350" height="350">
<style>
circle {
fill: white;
}
@media (prefers-color-scheme: light) {
circle {
fill: black;
}
}
</style>
<circle cx="150" cy="150" r="150" />
</svg>
<head>
<link rel="icon" href="svgfile.svg" />
...
</head>
Reference
이 문제에 관하여(주제 기반 전환 가능 Favicon), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/anweshgangula/theme-based-switchable-favicons-32dd텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
