ورقة الغش CSS سريعة وعملية من Toptal
نشرت: 2022-03-11Cascading Style Sheets ، أو CSS باختصار ، هي لغة ورقة أنماط مكتوبة بلغة ترميزية. تحدد CSS عناصر العرض التقديمي والشكل والتنسيق لمستندات الويب ، مثل التخطيط والألوان والخطوط.
بناء جملة CSS شامل ، وليس من السهل دائمًا معرفة البنية الدقيقة ، أو معرفة جميع خصائص CSS المتاحة والقيم المقابلة. لمساعدة مطوري ومصممي CSS ، أنشأ Toptal دليلًا مرجعيًا سريعًا وعرضه على المجتمع كتنزيل مجاني. يتضمن الدليل المرجعي لـ CSS بنية CSS وأهم المحددات والخصائص والأحجام والوحدات ومعلومات CSS مفيدة أخرى بتنسيق قصير وغني بالمعلومات. نأمل أن تجد ورقة الغش في CSS مورداً قيماً.
يمكنك أيضًا التحقق من صفحات موارد Toptal للحصول على معلومات إضافية حول أخطاء CSS الشائعة ودليل توظيف CSS وأسئلة مقابلة CSS ونصائح CSS وأفضل الممارسات.
انقر هنا لتنزيل ورقة الغش في CSS
ورقة الغش CSS
بناء الجملة | نموذج الصندوق | |||
/* تعليقات */ @نوع الوسائط { المحدد { الملكية: القيمة ؛ } } ملاحظة: نوع الوسائط اختياري | ![]() | |||
أسلوب مضمّن <tag> | ||||
نمط مضمّن <head> <style type = "text / css"> المحدد {الخاصية: القيمة؛ } </style> </head> | ||||
ورقة الأنماط الخارجية <head> <link rel = "stylesheet" اكتب = "text / css" href = "style.css" /> </head> | مربعات | |||
حافة | الهامش العلوي | |||
المحددات | حشوة | أعلى الحشو | ||
* | كل العناصر | |||
بطاقة شعار | جميع عناصر العلامة | الحدود | أعلى الحد | |
بطاقة شعار * | جميع العناصر داخل العلامة | |||
العلامة tag2 | عناصر tag2 داخل العلامة | لون الحدود | لون أعلى الحدود | |
علامة ، علامة 2 | جميع عناصر العلامة والعلامة 2 | |||
العلامة> tag2 | tag2 هو تابع للعلامة | نمط الحدود | أعلى الحدود | |
علامة + علامة 2 | tag2 مسبوقة بعلامة | |||
.صف دراسي | عناصر مع فئة "class" | عرض الحدود | عرض أعلى الحد | |
فئة العلامة | جميع العلامات مع فئة "class" | |||
#هوية شخصية | عنصر بالمعرف "id" | الحجم والألوان | ||
علامة # معرف | علامة بالمعرف "id" | الأحجام النسبية | م | rem | على سبيل المثال | الفصل فولكس فاجن | vh | vmin | vmax | ٪ | |
المحددات الزائفة | ||||
:نشيط | يضيف النمط إلى العنصر النشط | الأحجام المطلقة | سم | مم | في مقصف | pt | الكمبيوتر | |
:بعد | يضيف محتوى بعد عنصر | |||
:قبل | محتوى الإعلانات قبل العنصر | الألوان | عرافة # ff00ff | |
: أول طفل | يضيف النمط للطفل الأول | RGB rgb (255،0،255) | ||
:الرسالة الأولى | يضيف النمط إلى الحرف الأول | التمركز ![]() | ||
:السطر الأول | يضيف النمط إلى السطر الأول | وضع | مطلق | ثابت | نسبي | ثابت | يرث | |
:التركيز | يضيف النمط إلى العنصر المركز | |||
:يحوم | يضيف النمط عندما ينتهي الماوس | يطفو | غادر | حق | لا شيء | يرث | |
:حلقة الوصل | يضيف نمطًا إلى الرابط غير المرغوب فيه | |||
: زار | يضيف النمط إلى الارتباط الذي تمت زيارته | فوق على اليمين، | يضبط الإزاحة من الحافة | |
نص | ||||
خط العائلة | يحدد عائلة الخط | صافي | غادر | حق | كلاهما | لا شيء | يرث | |
حجم الخط | يحدد حجم الخط | |||
نوع الخط | عادي | مائل | منحرف | يرث | عرض | يحدد وضع العنصر في تدفق المستند | |
متغير الخط | عادي | قبعات صغيرة | يرث | تجاوز | مرئي | مخفي | التمرير | تلقائي | يرث | |
الخط -وزن | عادي | جريئة | أكثر جرأة | أخف وزنا | كثافة العمليات (100-900) | يرث | |||
الرؤية | مرئي | مخفي | انهيار | يرث | |||
اللون | يضبط لون النص | |||
ارتفاع خط | عادي | int | ٪ | يرث | الفهرس z | تلقائي | int | يرث | |
محاذاة النص | غادر | حق | مركز | يبرر | يرث | أبعاد | ||
ارتفاع | تلقائي | int | ٪ | يرث | |||
نص- زخرفة | لا شيء | تسطير | تسطير | من خلال الخط | وميض | يرث | اقصى ارتفاع | لا شيء | int | ٪ | يرث | |
أقصى عرض | لا شيء | int | ٪ | يرث | |||
المسافة البادئة النص | int | ٪ | يرث | أدنى ارتفاع | int | ٪ | يرث | |
نص- تحول | لا شيء | تكبير | أحرف كبيرة | صغير | يرث | العرض الأدنى | int | ٪ | يرث | |
العرض | تلقائي | int | ٪ | يرث | |||
عمودي - محاذاة | int | ٪ | خط الأساس | الفرعي | سوبر | أعلى | منتصف أعلى النص | أسفل | أسفل النص | يرث | آخر | ||
معرفتي | شكل: الخلفية (اللون) (الصورة) (كرر) (موقف) | |||
أبيض -الفضاء | عادي | ناراب | قبل | الخط المسبق | قبل التفاف | يرث | |||
المؤشر | اضبط نوع المؤشر | |||
تباعد الكلمات | عادي | الطول | يرث | يقتبس | تعيين نوع علامات الاقتباس |