قائمة مؤسسة الأسعار
ويمكن استخدام قائمة الأسعار لعرض منتجاتها:
أمثلة
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> الأساسية </ لى>
<لى الطبقة = "السعر"> $ 19،99 </ لى>
<لى الطبقة = "صفا"> عظيم للأعمال التجارية الصغيرة </ لى>
<لى الطبقة = "رصاصة البند "> 24/7 دعم </ لى>
<لى الطبقة = "رصاصة البند "> 15GB التخزين </ لى>
<لى الطبقة = "رصاصة البند "> 1GB عرض النطاق الترددي </ لى>
<لى الطبقة = "CTA على زر "> <a الطبقة = أ href = "button" "#"> شراء </ أ> </ لى>
</ UL>
<لى الطبقة = "عنوان"> الأساسية </ لى>
<لى الطبقة = "السعر"> $ 19،99 </ لى>
<لى الطبقة = "صفا"> عظيم للأعمال التجارية الصغيرة </ لى>
<لى الطبقة = "رصاصة البند "> 24/7 دعم </ لى>
<لى الطبقة = "رصاصة البند "> 15GB التخزين </ لى>
<لى الطبقة = "رصاصة البند "> 1GB عرض النطاق الترددي </ لى>
<لى الطبقة = "CTA على زر "> <a الطبقة = أ href = "button" "#"> شراء </ أ> </ لى>
</ UL>
محاولة »
أمثلة تحليلية
-
ul.pricing-table
- تعريف قائمة الأسعار -
li.title
- يحدد نتاج عنوان (خلفية سوداء) -
li.price
- تعريف السعر (البنود الكبيرة خلفية رمادية الخط) -
li.description
- يحدد وصف المنتج (إذا رغبت) -
li.bullet-item
- ملامح محددة -
li.ca-button
- نص الزر (مثل "شراء"، "تاريخ"، "تسجيل"، وما إلى ذلك)
ملاحظة: الجدول مليئة عرض 100٪ من الحاويات، وجميع البنود التي لديها حدود وأن تركزت.
قائمة الأسعار الشبكة
يوضح المثال التالي أسعار ثلاثة منتجات المؤسسة (ثلاثة هي عرض التقسيم المتساوي):
أمثلة
<فئة الدرجة = "الصف">
<فئة الدرجة = "متوسطة 4 أعمدة">
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> الأساسية </ لى>
...
</ UL>
</ div>
<فئة الدرجة = "متوسطة 4 أعمدة">
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> برو </ لى>
...
</ UL>
</ div>
<فئة الدرجة = "متوسطة 4 أعمدة">
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> بريميوم </ لى>
...
</ UL>
</ div>
</ div>
<فئة الدرجة = "متوسطة 4 أعمدة">
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> الأساسية </ لى>
...
</ UL>
</ div>
<فئة الدرجة = "متوسطة 4 أعمدة">
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> برو </ لى>
...
</ UL>
</ div>
<فئة الدرجة = "متوسطة 4 أعمدة">
<الطبقة UL = "تسعير الجدول ">
<لى الطبقة = "عنوان"> بريميوم </ لى>
...
</ UL>
</ div>
</ div>
محاولة »