آموزش گذاشتن باکس در وبلاگ

آموزش گذاشتن باکس در وبلاگ

سه تا باکس خفن هست  که می تونید توی وبتون استفاده کنید

باکس سبز-نام کلاس : bxs er

باکس زرد-نام کلاس : bxs ex 

باکس قرمز-نام کلاس : bxs er

بروز رسانی شامل تغییر فونت و کم کردن حجم کد ها بوده است

اموزش در ادامه مطلب 

برای ساخت باکس ها باید کد زیر را در ویرایش css قالب فعلی بذارید

@font-face {
    font-family: "Font Awesome 5 Pro";
    src: url('//bayanbox.ir/download/4850219363061259374/fa-solid-900.woff2') format('woff');
    font-style: normal;    
}
.bxs {
    display: block;
    Padding: 10px;
    color: #353535;
}
.bxs::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    PADDING-LEFT: 5PX;
}
.bxs.gd {
    background: #D2FFCF;
    border-right: 3px solid #088F7A;
}
.bxs.gd::before {
    content: '\f058';
    color: #088F7A;
}

.bxs.ex {
    background: #FFF8D4;
    border-right: 3px solid gold;
}
.bxs.ex::before {
    content: '\f05a';
    color: gold;
}

.bxs.er {
    background: #FFE2D9;
    border-right: 3px solid #FE8F6B;
}
.bxs.er::before {
    content: '\f071';
    color: #FE8F6B;
}

برای نمایش باکس ها باید کلاس انها رو فرا خانی کنید . 

برای فراخانی کلاس باید به سورس بروید و به تگ مورد نظر کلاس مورد نظر رو بدهید. به عکس زیر توجه کنید