ตัวอย่างการใส่ข้อความ css ::before ::after
วิธีการใส่เครื่องหมายและสัญลักษณ์ต่างๆ ใน content:' ' จะต้องใส่เป็นรหัสตาม CSS Entities Code ที่ขึ้นต้นด้วย \ (back slash) ตัวอย่างเช่น content:'\00AE'; ซึ่ง code 00AE นี้ คือเครื่องหมาย ® (เครื่องหมาย REGISTERED) และยังมี CSS Entities Code อื่นๆ อีกมากมาย ยกตัวอย่างเช่นตารางนี้
ตัวอย่าง CSS Entities Code
Char | CSS Entities | Name |
---|
~ | 007E | TILDE |
| 00A0 | NO-BREAK SPACE |
¡ | 00A1 | INVERTED EXCLAMATION MARK |
¢ | 00A2 | CENT SIGN |
£ | 00A3 | POUND SIGN |
¤ | 00A4 | CURRENCY SIGN |
¥ | 00A5 | YEN SIGN |
¦ | 00A6 | BROKEN BAR |
§ | 00A7 | SECTION SIGN |
¨ | 00A8 | DIAERESIS |
© | 00A9 | COPYRIGHT SIGN |
ª | 00AA | FEMININE ORDINAL INDICATOR |
« | 00AB | LEFT-POINTING DOUBLE ANGLE QUOTATION MARK |
¬ | 00AC | NOT SIGN |
| 00AD | SOFT HYPHEN |
® | 00AE | REGISTERED SIGN |
¯ | 00AF | MACRON |
° | 00B0 | DEGREE SIGN |
± | 00B1 | PLUS-MINUS SIGN |
² | 00B2 | SUPERSCRIPT TWO |
³ | 00B3 | SUPERSCRIPT THREE |
´ | 00B4 | ACUTE ACCENT |
µ | 00B5 | MICRO SIGN |
¶ | 00B6 | PILCROW SIGN |
· | 00B7 | MIDDLE DOT |
¸ | 00B8 | CEDILLA |
¹ | 00B9 | SUPERSCRIPT ONE |
º | 00BA | MASCULINE ORDINAL INDICATOR |
» | 00BB | RIGHT-POINTING DOUBLE ANGLE QUOTATION MARK |
¼ | 00BC | VULGAR FRACTION ONE QUARTER |
½ | 00BD | VULGAR FRACTION ONE HALF |
¾ | 00BE | VULGAR FRACTION THREE QUARTERS |
สามารถดู css entities code เพิ่มเติมได้ที่ https://www.w3schools.com/cssref/css_entities.asp
ตัวอย่างการใส่ css entities code ::before ::after
ตัวอย่างการใส่รูปภาพหรือไอคอนด้วย ::before ::after
จากตัวอย่างการใช้ css ::before ::after ข้างต้น แสดงให้เห็นวิธีการใช้งาน css เพื่อใส่ข้อความ, css entities code และรูปภาพหรือไอคอน ซึ่งใน pseudo-elements นี้ เรายังสามารถจัดรูปแบบต่างๆ ได้ เสมือนเป็น HTML แท็ก ถ้าบริษัทรับทำเว็บไซต์นำไปประยุกต์ใช้ดู ก็จะสามารถลด HTML แท็กที่ตั้งขึ้นมาเพื่อการแสดงผลใน Source Code ของเราได้อีกด้วย
บทความล่าสุด
19 พ.ค. 643,872
จากข้อมูลสถิติโดยเฉลี่ย 2 - 3% ของผู้เข้าชมเว็บเป็นผู้สนใจซื้อสินค้านั้นจริงๆ เคล็ดลับการออกแบบ UX ที่ดี 7 เคล็ดลับ สามารถช่วยเพิ่มยอดขาย มีอะไรบ้าง
8 พ.ค. 6436,129
บัญญัติ 10 ประการในการออกแบบเว็บไซต์ให้มีคุณภาพดี ตามหลักสากลนิยม ทำให้ผู้เข้าชมเกิดความรู้สึกประทับใจ ช่วยเสริมธุรกิจออนไลน์ มีอะไรบ้าง มาดูกัน
10 เม.ย. 649,199
Online Marketing คือ การทำการตลาด การทำโฆษณา ผ่านสื่อออนไลน์ ธุรกิจแบบไหนที่เหมาะกับการทำการตลาดออนไลน์? ทำการตลาดออนไลน์ทำอย่างไร?
6 เม.ย. 6420,357
หลักการทำเว็บไซต์แบบ Responsive Web Design เป็นที่นิยมมากในปัจจุบัน ซึ่งเป็นเรื่องของการใช้ CSS ควบคุมการแสดงผล ให้เว็บเพจดูสวยในทุกอุปกรณ์ คิดยังไง? ทำยังไง?