CSS هي طبقة العرض على الويب. يسمح لك بتصميم HTML لمساعدتك في تحقيق أهداف التصميم التي تضعها في اعتبارك لموقع الويب. يمكنك هنا العثور على مجموعة متنوعة من مجموعات المحتوى والدورات التدريبية والأنماط والروابط التي تؤدي إلى مقالات أخرى مفيدة لمساعدتك في رحلتك لتعلم CSS واستخدامها لجعل صفحات الويب تبدو بالشكل الذي تريده.
إذا كنت مبتدئًا في CSS، إليك بعض المعلومات المفيدة. تقدّم لك الدورة التدريبية "تعلّم CSS" إرشادات حول أساسيات عمل CSS.
تعرّف في الوقت الحالي على أحدث النصائح والتقنيات التي يمكنك استخدامها في عملك.
تعرَّف على أحدث ميزات CSS التي تم توفيرها مؤخرًا في جميع محرّكات المتصفّحات الرئيسية.
اطّلِع على بعض أنماط CSS التي يمكنك استخدامها لإنشاء تصاميم وصور متحركة ومظاهر لصفحات الويب بسرعة.
عندما يتعلق الأمر بسرعة الصفحة، يجب التركيز على CSS. يمكن أن تساعدك هذه الأدلة في معالجة مشاكل الأداء الشائعة عند استخدام CSS.
يمكن أن تؤثّر طريقة استخدامك لصفحات CSS في تسهيل استخدام تطبيقات الويب. يمكن لهذه الأدلة مساعدتك في التأكد من أنك تستخدم CSS بطريقة تسهل استخدام تطبيقات الويب للمزيد من الأشخاص.
بدءًا من تسهيل الاستخدام ووصولاً إلى z-index، يُعدّ بودكاست CSS طريقة رائعة للتعرّف على المزيد من المعلومات حول CSS من بعض أبرز الخبراء في المجال.
دورة تدريبية

إذا كنت مبتدئًا في CSS، إليك بعض المعلومات المفيدة. ترشدك دورة التعرّف على CSS إلى أساسيات آلية عمل CSS، بدءًا من أدوات الاختيار والسمات والقيم ومبادئ التنسيق الأساسية وكيفية تطبيقها على صفحات الويب.

تعرّف في الوقت الحالي على أحدث النصائح والتقنيات التي يمكنك استخدامها في عملك.
استخدِم خطًا يتوافق مع الإعدادات المفضّلة للمستخدمين، ما يضمن لهم قراءة المحتوى الخاص بك بسهولة أكبر.
تتيح الآن جميع المحرّكات الرئيسية مساحات ألوان CSS ووظائفها الجديدة. تعرَّف على كيفية إضفاء الحيوية على تصميماتك.
يمكنك تحسين تجربة تصحيح أخطاء الويب باستخدام خرائط المصدر.
أصبحت الشبكة الفرعية الآن قابلة للتشغيل التفاعلي عبر جميع المحركات الرئيسية الثلاثة. تعرَّف على كيفية استخدامها.

تُرسِل القاعدة الأساسية إشارات إلى مطوّري الويب عندما يمكن استخدام ميزات منصة الويب بأمان في جميع محرّكات المتصفّحات الرئيسية. في ما يلي بعض ميزات CSS التي أصبحت متاحة الآن في Baseline.

أصبح scrollbar-gutter متوفّرًا في الإصدار الأساسي في كانون الأول (ديسمبر) 2024.
أصبح ‎::target-text متاحًا في Baseline في كانون الأول (ديسمبر) 2024.
أصبح ruby-align متاحًا في Baseline في كانون الأول (ديسمبر) 2024.
أصبح ruby-position متوفّرًا في الإصدار الأساسي في كانون الأول (ديسمبر) 2024.
أصبحت بنية الألوان النسبية في CSS أساسية ومتوفّرة حديثًا في أيلول (سبتمبر) 2024.
أصبح مقياس visibility-content متاحًا للاستخدام الأساسي في أيلول (سبتمبر) 2024.
أصبح التنسيق CSS @starting-style متاحًا حديثًا في أغسطس (آب) 2024.
أصبح font-size-adjust متاحًا في Baseline اعتبارًا من يوليو (تموز) 2024.
أصبح مُستخدِم CSS @property هو Baseline متاحًا حديثًا في يوليو (تموز) 2024.
أصبحت light-dark() أساسية وأصبحت متاحة حديثًا في أيار (مايو) 2024.
أصبح align-content في تنسيق الكتل متاحًا في Baseline بدءًا من نيسان (أبريل) 2024.
أصبحت قيم offset-position وoffset-path متاحة في Baseline حديثًا في كانون الثاني (يناير) 2024.

اطلع على بعض أنماط CSS التي يمكنك استخدامها لإنشاء تخطيطات ورسوم متحركة وموضوعات لصفحات الويب الخاصة بك بسرعة.

أنماط التنسيق التي تم إنشاؤها باستخدام واجهات برمجة تطبيقات CSS الحديثة والتي تساعدك في إنشاء واجهات شائعة، مثل البطاقات ومناطق الشبكة الديناميكية والتنسيقات بملء الصفحة.
تقنيات الصور المتحركة التي تم إنشاؤها باستخدام CSS أو JavaScript مع مراعاة تسهيل الاستخدام والإعدادات المفضّلة للمستخدم
أساليب للمساعدة في إدارة الألوان خلال مشروعاتك.
تتحمّل خدمة CSS مسؤولية الكثير من عمليات العرض التي تتم على الصفحة، ما يؤثّر في سرعة ظهور الصفحة واستجابتها لتفاعلات المستخدم. يمكن أن تساعدك هذه الأدلة في كتابة CSS مع وضع سرعة الصفحة في الاعتبار.
إعادة حساب الأنماط هي عملية يتم فيها تطبيق قواعد CSS على نموذج العناصر في المستند (DOM)، حيث يمكن أن تتسبب أدوات الاختيار الشديدة التعقيد في حدوث مشاكل في الأداء. اطّلِع على هذا الدليل لمعرفة كيفية تحسين أدوات الاختيار لتحسين الأداء.
يمكن استخدام السمة content-visibility لتأجيل عرض أجزاء من الصفحة إلى أن تصبح مطلوبة. يوضّح هذا الدليل كيفية استخدام هذه السمة لتحسين أداء عرض تطبيق الويب.
يمكن أن تؤثر طريقة كتابة الأنماط في مؤشرات أداء الويب الأساسية بشكل كبير. اقرأ هذا الدليل لمعرفة كيفية ضبط CSS لتطبيق الويب للحصول على أداء أفضل.
يمكن أن تؤدي أحجام DOM الكبيرة إلى تشغيل عمليات عرض طويلة، ويمكن أن يؤثر ذلك في مدى استجابة تطبيق الويب لإدخالات المستخدم. اطّلِع على هذا الدليل لمعرفة كيفية الحفاظ على أحجام عناصر DOM أصغر للحصول على أداء أفضل.
بدءًا من تباين الألوان ووصولاً إلى التصميم السريع الاستجابة، يؤثر CSS بالتأكيد في مدى سهولة استخدام تطبيقات الويب لجميع المستخدمين. اطّلِع على هذه الأدلة لتحسين معرفتك بلغة CSS حتى تتمكّن من إنشاء تطبيقات ويب قابلة للاستخدام من قِبل المزيد من المستخدمين.
لتصميم العناصر التفاعلية على الصفحات بطريقة يسهل الوصول إليها، عليك مراعاة حجم العناصر والمسافة بينها لتسهيل استخدامها. اطّلِع على هذه الإرشادات لإنشاء تطبيقات ويب يسهل على المستخدمين التنقّل فيها.
تباين الألوان هو جانب مهم من التصميم يتيح للمستخدمين قراءة المحتوى الخاص بك بسهولة أكبر. يمكن أن يساعدك هذا الدليل في إنشاء تطبيقات ويب جميلة تركّز على سهولة القراءة وسهولة الاستخدام.
ندرك أنّه من الأفضل تصميم التطبيقات بطريقة متجاوبة لتوفير أفضل تجربة على الأجهزة المتعددة، ولكنّ التصميم المتجاوب يُحسِّن أيضًا من إمكانية الوصول إلى المحتوى.
إنّ ترتيب المحتوى في مستندك مهم لتسهيل استخدام موقعك الإلكتروني، ومن الممكن أن يؤثّر أسلوب CSS الذي تستخدمه في تسهيل الاستخدام. سيقدّم لك هذا الدليل كل ما تحتاج إلى معرفته عند استخدام CSS لإعادة ترتيب الترتيب المرئي لمحتوى صفحاتك.

CSS هي لغة التصميم الأساسية على الويب. بالنسبة إلى مطوّري الويب، هذه إحدى التكنولوجيات الأسرع في البدء، ولكنها من أصعب التقنيات التي يمكن إتقانها. يمكنك متابعة "أونا كرافيتس" و"آدم أرجيل"، وهما من مدافعي المطوّرين في Google، حيث يشرحان بسعادة الجوانب المعقدة من CSS في حلقات سهلة الاستيعاب تتناول كل شيء من تسهيل الاستخدام إلى z-index.