Biblioteci icon
Cu W3.CSS puteți utiliza orice bibliotecă pictogramă cum ar fi:
- Icoane Awesome Font
- Icoane Google Material
- bootstrap Icoane
Utilizarea pictogramelor
Pentru a utiliza o pictogramă, trebuie doar să adăugați numele pictogramei clasei unui HTML <i> Element.
Pentru a controla dimensiunea pictogramei, modificați proprietatea font-size a pictogramei, sau de a folosi clasele de mărime w3-:
- W3-tiny
- W3-mici
- W3-mare
- W3-xxlarge
- W3-xxxlarge
Icoane Awesome Font
fa fa-acasă
fa fa-baruri
fa fa-săgeată stânga
fa fa-săgeată-dreapta
fa fa-căutarea
fa fa-close
fa fa-reîmprospătare
fa fa-coș de gunoi
fa fa-masculin
fa fa-car
fa fa-camion
fa fa-plan
Exemplu
<!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>
Încearcă - l singur » Pentru o listă completă de icoane: Vizitați nostru de referință icon
Material Design Icoane Google
Acasă
Acasă
Acasă
meniul
meniul
meniul
arrow_back
arrow_back
arrow_back
arrow_forward
arrow_forward
arrow_forward
căutare
căutare
căutare
închide
închide
închide
reîmprospăta
reîmprospăta
reîmprospăta
șterge
șterge
șterge
persoană
persoană
persoană
directions_car
directions_car
directions_car
local_shipping
local_shipping
local_shipping
local_airport
local_airport
local_airport
Exemplu
<!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>
Încearcă - l singur » bootstrap Icoane
Acasă
meniu hamburger
arrow_back
arrow_forward
căutare
elimina
reîmprospăta
Gunoi
utilizator
fişier
imprimare
avion
Exemplu
<!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>
Încearcă - l singur »