Investment Highlight

การ์ดจุดเด่นด้านการลงทุนสไตล์ widget3

การ์ดจุดเด่นด้านการลงทุนสไตล์ widget3 — ตัวเลขสถิติ 4 ช่องคั่นด้วยเส้นแบ่ง (ประสบการณ์ / ธุรกิจในเครือ / มูลค่าหลักทรัพย์ / เงินปันผลล่าสุด) ตามด้วยแถบภาพธุรกิจหลักและย่อหน้าอธิบายวิสัยทัศน์

Set widget3Category aboutScope .stk-w3-investment-highlightSet base widget3

Examples

แต่ละหัวข้อคือ UI คนละรูปแบบ ส่วนขนาดคอลัมน์เป็น layout ของรูปแบบเดียวกัน

การ์ดสถิติ 4 ช่อง + แถบภาพธุรกิจหลัก

UI รูปแบบที่ 1

1 layout

PreviewOpen

defaultการ์ดสถิติ 4 ช่อง + แถบภาพธุรกิจหลักGrid 12/12 · Measuring UI… · JavaScript

Composition

โครงสร้างส่วนประกอบหลักที่สรุปจาก HTML ของแต่ละ variant โดยตัด layout wrappers ออก

Variantdefault

Loading composition…

Content Schema

อ่าน schema เต็มและตัวอย่างค่าจาก get_widget ฟิลด์หลัก:

title
stat1_label
stat1_value
stat1_unit
stat2_label
stat2_value
stat2_unit
stat3_label
stat3_value
stat3_unit
stat4_label
stat4_value
stat4_unit
description

Asset URLs

CSS: https://stackui-cdn.intern-studio.com/widgets/widget3/investment-highlight/investment-highlight.css
JS:  https://stackui-cdn.intern-studio.com/widgets/widget3/investment-highlight/investment-highlight.js
Preview: https://stackui-cdn.intern-studio.com/widgets/widget3/investment-highlight/preview.html
Set base: ดู dependencies.setBase จาก get_widget และโหลดก่อน widget CSS

ใช้ get_core ก่อนหนึ่งครั้ง จากนั้นเรียก get_widget โดยส่ง id="investment-highlight" และ set="widget3" เพื่อรับ HTML, CSS, JavaScript, dependencies และ URL ของ asset ที่ตรงกับ environment