CDN에서 손쉽게 Font Awesome 사용
3583 단어 HTMLcdnFontAwesome
샘플 코드
다음과 같이 쓰면 어떤 프레임워크라도 관계없이 Font Awesome을 사용할 수 있습니다.
sample.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel ="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<title>test</title>
</head>
<body>
<i class="fas fa-thumbs-up"></i>
</html>
이런 식으로 아이콘이 표시됩니다.
보충으로 설명
css 파일을 읽는 URI 얻기
다음 줄에서 Font Awesome을 표시하는 css 파일을 읽습니다.
<link rel ="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
이 css 파일의 URI는 "font-awesome - Libraries"에서 얻을 수 있습니다.
사용할 아이콘의 HTML 가져오기
다음의 1행으로 아이콘을 표시하고 있습니다.
<i class="fas fa-thumbs-up"></i>
이 HTML은 Font Awesome 사이트로 이동하여 검색합니다.
자유로운 물건을 사용한다면 "Free Icons"(빨간색 테두리 부분)를 클릭합니다 (2021 년 8 월 현재).
표시된 아이콘에서 원하는 것을 찾아 클릭합니다.
빨간색 프레임 부분이 필요한 HTML입니다. 클릭하면 사본으로 얻을 수 있습니다.
<참고 사이트>
Font Awesome 5 아이콘을 CDN 및 다운로드 데이터로 브라우저 보기
Font Awesome 5는 공식 CDN으로 CSS 배포를 중단하는 것 같습니다.
잡기
현재는 Spring Boot라는 WEB 프레임워크를 사용하고 있습니다. 필요에 임박했을 때에 조사하면 좋을까 생각합니다.
Reference
이 문제에 관하여(CDN에서 손쉽게 Font Awesome 사용), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/t-yama-3/items/0d43c0738063b15f4963텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)