طريقة استخدام خصائص CSS3 columns و الأمثلة

خصائص CSS columns هي خاصية مختصرة تستخدم لضبطcolumn-widthوcolumn-countخصائص.

الجدول التالي يوضح استخدام هذا الخصائص والسجلات التاريخية للإصدارات، بالإضافة إلى الجملة التي يستخدمها هذا الخصائص في سكربت جافا سكريبت.

نموذج استخدام الوسائط

نموذج هذا الخصائص كالتالي:

columns:　[　column-width　column-count　]　|　initial　|　inherit

المثال التالي يوضح كيفية استخدام خصائص columns.

p　{
　　　　-webkit-columns:　150px　3;　/*　Chrome,　Safari,　Opera　*/
　　　　　　　-moz-columns:　150px　3;　/*　Firefox　*/
　　　　　　　　　　　　columns:　150px　3;　
}

قيمة الخصائص

جدول التالي يصف قيم هذا الخصائص.

توافق المتصفح

مستوى التوافق للمتصفحات الخاصة بخصائص columns، الأرقام في الجدول التالي تعكس إصدار أحدث متصفح يدعم هذا الخصائص؛ جميع المتصفحات الشائعة يدعم هذا الخصائص.

قراءة المزيد

يرجى الرجوع إلى التعليمات التالية:تصميم الصفوف المتعددة CSS3。

خصائص مرتبطة:column-span،column-fill،column-gap،column-rule،column-rule-color،column-rule-style،column-rule-width،column-count،column-width。