Simge Kütüphaneler
W3.CSS ile herhangi ikon kütüphane gibi kullanabilirsiniz:
- Yazı Müthiş Simgeler
- Google Malzeme Simgeler
- Bootstrap Simgeler
Simgeleri kullanma
Bir simge kullanmak için, sadece bir HTML sınıfına simgenin adını ekleyin <i> öğesi.
Simgenin boyutunu kontrol etmek için, simgenin font-size özelliğini değiştirmek veya w3- boyut sınıflarını kullanın:
- w3-minik
- w3-küçük
- w3-large
- w3-XXLarge
- w3-xxxlarge
Yazı Müthiş Simgeler
fa fa-ev
fa fa-barlar
fa fa-ok-sol
fa fa-ok sağ
fa fa-arama
fa fa-yakın
fa fa-yenileme
fa fa-çöp
fa fa-erkek
fa fa-araba
fa fa-kamyon
fa fa-düzlemi
Örnek
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet"
href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<body>
<i class="fa fa-cloud"></i>
<i class="fa fa-cloud
w3-large"></i>
<i class="fa fa-cloud w3-xlarge"></i>
<i class="fa fa-cloud
w3-xxlarge"></i>
<i class="fa fa-cloud w3-xxxlarge"></i>
<i class="fa fa-cloud
w3-text-teal"
style="font-size:64px"></i>
</body>
</html>
Kendin dene " 
Simgelerin tam listesi için: bizim simge referansını edin
Google Materyal Tasarımı Simgeler
ev
ev
ev
menü
menü
menü
arrow_back
arrow_back
arrow_back
arrow_forward
arrow_forward
arrow_forward
arama
arama
arama
kapat
kapat
kapat
yenileme
yenileme
yenileme
silmek
silmek
silmek
kişi
kişi
kişi
directions_car
directions_car
directions_car
local_shipping
local_shipping
local_shipping
local_airport
local_airport
local_airport
Örnek
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<body>
<i class="material-icons">cloud</i>
<i class="material-icons w3-large">cloud</i>
<i
class="material-icons w3-xlarge">cloud</i>
<i class="material-icons
w3-xxlarge">cloud</i>
<i class="material-icons w3-xxxlarge">cloud</i>
<i
class="material-icons w3-text-teal" style="font-size:64px">cloud</i>
</body>
</html>
Kendin dene " Bootstrap Simgeler
ev
Menü-hamburger
arrow_back
arrow_forward
arama
Kaldır
yenileme
çöp
kullanıcı
dosya
baskı
uçak
Örnek
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet"
href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<body>
<i class="glyphicon
glyphicon-cloud"></i>
<i class="glyphicon glyphicon-cloud w3-large"></i>
<i class="glyphicon glyphicon-cloud w3-xlarge"></i>
<i class="glyphicon
glyphicon-cloud w3-xxlarge"></i>
<i class="glyphicon glyphicon-cloud
w3-xxxlarge"></i>
<i class="glyphicon glyphicon-cloud w3-text-teal"
style="font-size:64px"></i>
</body>
</html>
Kendin dene "