CSS အကြောင်း

အက်ကြုး ထပ်ပေါင်း ဘယ်လိုဖြစ်သလို

HTML စာမေးသတင်း အတွက် အက်ကြုး အသုံးပြုကြသော အနည်းဆုံး နည်းလမ်း အချင်း အက်ကြုး အချင်း အော်ဂန်တက် ဖြစ်သည်。

တခုခု အသုံးပြု လိုက်ပါ အင်္ဂါမိုး HTML အစိတ်အတွင်း အက်ကြုး အသုံးပြုပါ (ဥပမာ <i> သို့မဟုတ် <span>)。

အော်ဂန်တက် အက်ကြုး အချို့ အက်ကြုး အား အမျိုးအစား ပြောင်းလဲ နိုင်သည့် ဗဟိုအက်ဥပဒေ ဖြင့် ကိုယ်တိုင် ကူညီ ပြုလုပ် နိုင်သည် (အရွယ်၊ အရောင်၊ အရောင်ချိုးခြင်း စသည်တို့)。

ဖန်ဝိုက် အက်ကြုး

Font Awesome အကြောင်းရည် အသုံးပြုရန် fontawesome.com ကို ထိုးထည်းချက် သွားရပ်တော် မှ ဝင်ရောက် သုံးစွဲခြင်း အချက်အလက် နှင့် အသုံးပြုခြင်း ကို အပ်နှံမည်:

<script src="https://kit.fontawesome.com/yourcode.js"></script>

Font Awesome 5 ပြောင်းလဲခြင်း တွင် အစတွင်းပိုင်း အသုံးပြုခြင်း နှင့် ပတ်သတ်သော အသေးစိတ်အချက်အလက် ကြည့်ရှုမည်:

အဆိုပါ:သို့မဟုတ် တင်ဆက်မှုမပြုသင်!

အမှတ်

<!DOCTYPE html>
<html>
<head>
<script src="https://kit.fontawesome.com/a076d05399.js"></script>


<i class="fas fa-cloud"></i>
<i class="fas fa-heart"></i>
<i class="fas fa-car"></i>
<i class="fas fa-file"></i>
<i class="fas fa-bars"></i>

结果：

亲自试一试

Bootstrap အကြောင်းရည်

Bootstrap အကြောင်းရည် အသုံးပြုရန် အိမ်ပိုင်ရေးပုံနှိပ်ပုံ စာကြိုးအချို့ တွင် ထိုးထည်းချက် အပါအဝင် အပ်နှံမည်:

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

အဆိုပါ:သို့မဟုတ် တင်ဆက်မှုမပြုသင်!

အမှတ်

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">


<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>

结果：

亲自试一试

Google အကြောင်းရည်

Google အကြောင်းရည် အသုံးပြုရန် အိမ်ပိုင်ရေးပုံနှိပ်ပုံ စာကြိုးအချို့ တွင် ထိုးထည်းချက် အပါအဝင် အပ်နှံမည်:

<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">


cloud
favorite
attachment
computer
traffic

结果：

亲自试一试