아이콘을 추가하는 방법
아이콘을 삽입하려면 어떤 인라인 HTML 요소에 아이콘 클래스의 이름을 추가합니다.
은 <i> 과 <span> 요소는 널리 아이콘을 추가하는 데 사용됩니다.
아래 아이콘 라이브러리의 모든 아이콘, CSS로 사용자 정의 할 수 있습니다 확장 가능한 벡터 아이콘입니다 (size, color, shadow, etc.)
글꼴 최고 아이콘
글꼴 최고 아이콘을 사용하려면 내부에 다음 줄을 추가 <head> HTML 페이지의 섹션 :
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
참고 : 다운로드 또는 설치가 필요하지 않습니다!
예
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<i class="fa fa-cloud"></i>
<i
class="fa fa-heart"></i>
<i class="fa fa-car"></i>
<i class="fa fa-file"></i>
<i class="fa fa-bars"></i>
</body>
</html>
»그에게 자신을보십시오 부트 스트랩 아이콘
부트 스트랩 glyphicons을 사용하려면 내부에 다음 줄을 추가 <head> HTML 페이지의 섹션 :
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
참고 : 다운로드 또는 설치가 필요하지 않습니다!
예
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
</head>
<body>
<i class="glyphicon glyphicon-cloud"></i>
<i class="glyphicon
glyphicon-remove"></i>
<i class="glyphicon glyphicon-user"></i>
<i
class="glyphicon glyphicon-envelope"></i>
<i class="glyphicon glyphicon-thumbs-up"></i>
</body>
</html>
»그에게 자신을보십시오 구글 아이콘
구글 아이콘을 사용하려면 내부에 다음 줄을 추가 <head> HTML 페이지의 섹션 :
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
참고 : 다운로드 또는 설치가 필요하지 않습니다!
예
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body>
<i class="material-icons">cloud</i>
<i
class="material-icons">favorite</i>
<i
class="material-icons">attachment</i>
<i
class="material-icons">computer</i>
<i
class="material-icons">traffic</i>
</body>
</html>
»그에게 자신을보십시오 모든 글꼴 최고 아이콘의 전체 목록은 방문 글꼴 최고 아이콘 참조 .
모든 부트 스트랩 Glyphicons의 전체 목록은 방문 부트 스트랩 Glyphicon 참조 .
모든 Google 아이콘의 전체 목록은 방문 구글 아이콘 참조 .