广西快乐10分开奖记录|广西快乐10分走势图表
THE WORLD'S LARGEST WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

Icons Tutorial



How To Add Icons

To insert an icon, add the name of the icon class to any inline HTML element.

The <i> and <span> elements are widely used to add icons.

All the icons in the icon libraries below, are scalable vector icons that can be customized with CSS (size, color, shadow, etc.)


Font Awesome Icons

To use the Font Awesome icons, add the following line inside the <head> section of your HTML page:

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">

Note: No downloading or installation is required!

Example

<!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>
Try It Yourself »

Bootstrap Icons

To use the Bootstrap glyphicons, add the following line inside the <head> section of your HTML page:

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

Note: No downloading or installation is required!

Example

<!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>
Try It Yourself »

Google Icons

To use the Google icons, add the following line inside the <head> section of your HTML page:

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

Note: No downloading or installation is required!

Example

<!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>
Try It Yourself »

For a complete list of all Font Awesome icons, visit the Font Awesome icon reference.

For a complete list of all Bootstrap Glyphicons, visit the Bootstrap Glyphicon reference.

For a complete list of all Google icons, visit the Google icon reference.


广西快乐10分开奖记录 百人牛牛透视 广西快三开奖网址 什么东西卖赚钱 赢乐棋牌代理 赛车qq计划群 德州扑克赢现金皇冠 汇丰电商怎么赚钱的 金库电子游戏平台 恒耀登录地址 重庆时时下载