U3F1ZWV6ZTQwNTc4ODgxMl9BY3RpdmF0aW9uNDU5NzAzMTIwMA==
recent
أخبار

ما هو CSS | كورس تعليم الكمبيوتر وتعليم اكواد الموقع الالكترونى | بلوجر ووردبريس Blogger - Wordpress

 

ما هو CSS | كورس تعليم الكمبيوتر وتعليم اكواد الموقع الالكترونى | بلوجر ووردبريس Blogger - Wordpress

ما هو CSS


نود أن نجعل موقعنا يبدو أكثر جاذبية. أفضل طريقة للقيام بذلك هي استخدام تقنية تسمى CSS، تشير CSS إلى أوراق الأنماط المتتالية Cascading Style Sheets. دعونا نلقي نظرة على ما يعنيه هذا.


"ورقة الأنماط"Style sheet هي قائمة من القواعد حول كيفية ظهور صفحة الويب الخاصة بنا. على سبيل المثال ، قد يكون لدينا قاعدة تنص على أن "جميع العناوين خضراء" أو قاعدة تقول "ضع مسافة كبيرة بين كل فقرة".


ماذا يعني أن أوراق الأنماط لدينا هي "المتتالية" cascading ؟


في هذا السياق ، يعني "التتالي" أنه يمكن أن يكون لدينا قواعد متعددة تنطبق على نفس جزء HTML ، والقواعد "تتالي" لتحديد أيها يفوزفي CSS ، تفوز القاعدة الأكثر تحديدا دائما. دعنا نفهم هذا بمثال:

إذا كان لدي قاعدتان مثل هذه:


**جميع العناوين خضراء

** العنوان الثاني على الصفحة أزرق

ثم ما هو لون العنوان الثاني؟ تتعارض هاتان القاعدتان مع بعضهما البعض: لا يمكن أن يكون كل من الأخضر والأزرق! ونظرًا لأن القاعدة الأكثر تحديدا تفوز دائما ، يمكننا أن نرى أنه سيتم استخدام القاعدة الثانية. القاعدة الثانية أكثر تحديدا: فهي تنطبق فقط على العنوان الثاني. لذلك في صفحتنا ستكون جميع العناوين خضراء ، باستثناء الثانية التي ستكون زرقاء.


هذا مثال على تأثير "التسلسل" للقواعد في أوراق الأنماط لدينا.

ما نوع القواعد التي يمكننا وضعها في أوراق الأنماط لدينا؟

يحتوي CSS على العديد من القواعد الممكنة وهو قوي جدًا. فيما يلي بعض القواعد التي يمكننا تطبيقها:


لون العناصر على صفحتنا

وضع العناصر على صفحتنا

حجم العناصر

كيف يتم تقسيم أجزاء الصفحة

صور الخلفية

الرسوم المتحركة

التأثيرات المرئية ، على سبيل المثال زوايا مدورة


لذا تنطبق هذه القاعدة الأولى على عنصر HTML "html". هل تتذكر علامة <html> التي تعلمنا عنها؟ تحتوي هذه العلامة على جميع صفحات html لصفحة الويب بأكملها. لذا فإن أي قواعد نضعها في قاعدة "html" تنطبق على كل عنصر في الصفحة.


ماذا تفعل هذه القاعدة؟

كل قاعدة CSS لها خاصية وقيمة. في مثالنا ، الخاصية هي "font-family" والقيمة هي "Arial"..يتم تحديد الخصائص بواسطة CSS ، لذلك يتعين علينا استخدام الخصائص الصحيحة للحصول على التأثير الذي نريده. في هذه الحالة ، تتيح لنا خاصية CSS "font-family" تعيين الخط على أي عنصر. في هذه الحالة ، نقوم بتعيينه على الخط "Arial".


تعيين الخط لأي شيء داخل علامة <html> ليكون Arial.

سنلقي نظرة أكثر تفصيلا على خصائص مثل "المساحة المتروكة" في الدروس اللاحقة. في الوقت الحالي ، نريد فقط أن نفهم كيف يتم تشكيل هذه القواعد.


في هذه الحالة ، نقوم بتعيين جميع الروابط على الصفحة (تذكر ، يتم تعريف الروابط بواسطة علامة <a>!) بحيث لا تحتوي على زخرفة (أي لا يوجد تسطير) وأن تكون زرقاء.

 


الاسمبريد إلكترونيرسالة