어느정도 규모 이상의 웹페이지라면,
브라우저에서 탭을 띄울 때, 이름 왼쪽에 아이콘이 뜬다.
이를 favicon이라고 한다.
개인이 웹페이지를 만들 때, 이러한 favicon을 어떻게 만들고 적용시킬까?
[
favicon.ico Generator
Preview Favicon in original size:
위 페이지를 방문해보자.
favicon을 직접 그리거나, 이미지를 불러와 만들 수도 있다.
예를들어 다음과 같은 이미지를 불러오면,
이렇게 변환해준다.
아래쪽의 download favicon을 누르면 .ico 형태로 다운로드 된다.
그리고 작성한 html 파일에서
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>title</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="icon", href="favicon.ico">
</head>
<body>
<!-- blablabla -->
</body>
</html>
link rel="icon"으로 적용시켜주면 된다.
성공!
'프로그래머 > CSS' 카테고리의 다른 글
| [HTML/CSS] 웹 상에서 원하는 폰트를 적용해보자 | 폰트 다운로드 | google fonts (0) | 2021.01.24 |
|---|---|
| [Emojipedia] 무료 이모티콘 다운로드 사이트 | 이모지피디아 (0) | 2021.01.17 |
| [CSS] css 디자인시 적절한 색을 찾을 수 있는 사이트 (0) | 2021.01.16 |
