Font Awesome sayt grafikasi haqida

Xabarlar

Master-X [601] [1m]
#1 17:16:01, 25 Jan 2019

Assalomu aleykum forumdoshlar men bugun 1-darsimda Font Awesome`dan qanday foydalanish haqida yozmoqchiman demak boshladik.
Font Awesome sizni anchagina ovora garchiliklardan halos etadi, Ya'ni Font Awesome`ni saytingizga o'rnatish orqali saytingiz uchun rasmchalar izlashdan, tayorlashdan halos bo'lasiz. PHP`da ishlovchi saytning tepa (head) qismiga ikki qator kod yozasiz va tayyor qo'rqmay saytingizga icon`kalarni chiqaraverasiz

!

Font Awesome dan foydalanish uchun quidagi kodni saytingizning tepa (head) qismiga yozing.

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

Kerakli icon`ni sahifaga chiqarish uchun esa mana bu koddan foydalanamiz

<i class="fa fa-car"></i>

Belgilangan o`lcham

fa-fw fa-lg fa-2x fa-3x fa-4x fa-5x 
 
<i class="fa fa-car fa-fw"></i>
<i class="fa fa-car fa-lg"></i>
<i class="fa fa-car fa-2x"></i>
<i class="fa fa-car fa-3x"></i>
<i class="fa fa-car fa-4x"></i>
<i class="fa fa-car fa-5x"></i>

Hohlagan o'lchamga keltirish uchun

style="font-size:48px;" 
 
<i class="fa fa-car" style="font-size:48px;"></i>

Rang berish

style="color:red;"
 
<i class="fa fa-car" style="color:red;"></i>

Aylanib turuvchi icon

fa-spin
 
<i class="fa fa-spinner fa-spin"></i>

Aylantirish

<i class="fa fa-car"></i>
<i class="fa fa-car fa-rotate-90"></i>
<i class="fa fa-car fa-rotate-180"></i>
<i class="fa fa-car fa-rotate-270"></i>
<i class="fa fa-car fa-flip-horizontal"></i>
<i class="fa fa-car fa-flip-vertical"></i>

Agar iconkani standart usulda chiqarib boshqa amallarni teng bajarmoqchi bo'lsangiz ya'ni iconka menu classda bo'lsa menu text rangi qanday bo'lsa iconka rangi ham shunday chiqadi buni barchasini birdaniga o'zgartirmoqchi bo'lsangiz yoki border radus bermoqchi bo'lsangiz style.css orqali bajarish ham mumkin buning uchun

Sahifaga iconkadi quidagicha chiqarishingiz mumkin

<div class="menu"><i class="fa fa-car fa-fw"></i>Menu uchun link</div>

// style.css uchun
 
.menu i.fa {
color: #777;
border-radius: 50px;
}

Kabi moslab olishingiz mumkin

Barcha iconlar kodlari 👇👇👇
https://www.w3schools.com/icons/fontawesome_icons_webapp.asp
Yoki java tel ochishda qiynalsa
http://tanaffus.ru/wm/font-awesome/code.php

+ (4): XuSha, dayko, CHEfan, Сирожиддин,

Akbarali [1131] [off]
#3 21:22:24, 25 Jan 2019

XuSha, # XuSha (25.01.2019 / 19:04)
Master-X, sizni saytingizdagiday sahifani pastiga tushganda TEPAGA dip chiqadiyu shuni qaysi kod orqali qoysam boladi?

<script type="text/jаvаsсriрt" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/jаvаsсriрt">
$(function() {
$.fn.scrollToTop = function() {
$(this).hide().removeAttr("href");
if ($(window).scrollTop() >= "250") $(this).fadeIn("slow")
var scrollDiv = $(this);
$(window).scroll(function() {
if ($(window).scrollTop() <= "250") $(scrollDiv).fadeOut("slow")
else $(scrollDiv).fadeIn("slow")
});
$(this).click(function() {
$("html, body").animate({scrollTop: 0}, "slow")
})
}
});
$(function() {
$("#Go_Top").scrollToTop();
});
</script>
<a style="position: fixed; bottom: 25px; right: 1px; cursor: pointer; display: block;" id="Go_Top">
<img src=" https://saytuz.ru/gotop.png alt="Наверх" title="Yuqoriga" width="50px"></a>

.
Juda murakkablashtrib yubordima ?

. tepaga knopkasini oddiy div=id bilan qilsa ham bo'ladi.
.
1000 postim ekan.

+ (3): XuSha, dayko, Сирожиддин,

Kecha men mast edim,<br /> Mast edim menmas edim. :D