กดถูกใจ เป็นกำลังใจให้เรา 😍

VIR9.COM

ขอบคุณน๊าา 🥰

Close

  • how to include font awesome icons in css

    October 27, 2022

    https://www.angularjswiki.com/fontawesome/csscontentcode/

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

<!--Brand Icon -->
<span class="twitter"></span>

<!--Regular Icon -->
<span class="user"></span>

<!--Solid Icon -->
<span class="cloud"></span>

    Step 3: Set the CSS content code for the icon.

    Go through the 2016 free font awesome icons, to get the CSS content code.
    กดเข้าไปที่ลิ้งด้านบน
    แล้วเลือกไอคอนที่ต้องการ
    แล้วกด tryit จะมีโค๊ด html และ แบบแสดงติดกับ css ตัวอย่าง hive

    For all icons, unicode values are already defined.

    /* Brand icon*/
.twitter::before {
  content: '\f099';
}

/* Regular Icon */
.user::before {
  content: '\f007';
}

/* Solid Icon */
.cloud::before {
  content: '\f0c2';
}

    …

    https://fontawesome.com/v5/docs/web/advanced/css-pseudo-elements

    วิธีที่ใช้ได้
    https://stackoverflow.com/questions/20782368/use-font-awesome-icon-as-css-content

    <style>
a.F-blue:before {font-family: FontAwesome;content: "\e07f";}
</style> 

<a href="#" class="F-blue">a</a>

F-blue คือ class css ที่ต้องการให้เอา icon ไปใส่ทุกครั้งที่ใช้

เวอไนน์ไอคอร์ส

ประหยัดเวลากว่า 100 เท่า!

เวอไนน์เว็บไซต์⚡️
สร้างเว็บไซต์ ดูแลเว็บไซต์

Categories

Uncategorized