كود حصرى لجعل صورة الخلفية للصفحة تتناسب مع حجم الشاشة بتقنية [ Css3 ]

Progs4u · 24-11-2010, 06:25 PM

الـسلام عليكم ورحمة الله وبركاته
بسم الله الرحمن الرحيم

ازيكم يا الغالين ،، إن شاء الله بخير دايـماً

أقدم لكم كود حصري جداااً ..

لجعل صورة الخلفية للصفحة تتناسب مع حجم الشاشة بتقنية [ Css3 ]
* فيجعل الصورة تظهر كاملة و تملاء الشاشة للتتناسب مع حجم المتصفح او مقاس الشاشة لديك ..
* يجعل الكود ايضاً الخلفية ثابتة لا تتأثر بحركة المحتوى نزولاً او صعوداً ..

مشاهدة مباشر :
http://www.progs4u.net/vb/example/full-background

هذا الكود ..

html { background: url(images/bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

مع تغيير مسار صورة :
images/bg.jpg

متوافق متصفحات :
Safari 3 - Chrome Whatever - IE 9 - Opera 10 - Firefox 3.6
----------------------------------------------------------------------------

1. شرح تركيب كود للمنتديات :
يتم وضع الكود فى [ تعاريف CSS الإضافية/Additional CSS Definitions ]
فى المربع الثانى الموجود فى التحكم بالاستايل ،، ثم اضغط حفظ ..
-------------------------
2. شرح تركيب كود للمواقع :
وضع كود فى ملف Css اى مكان ..
لو مش موجود ملف Css ،، افتح ملف اندكس [ index ]
الان ابحث كلمة

</title>

ثم وضع كود اسفله :

<style type="text/css"> html { background: url(images/bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } </style>

مع تغيير مسار صورة :
images/bg.jpg
------------------------------------

إنتهت .. تم بحمد لله

الموضوع كامل جهد شخصي ،، دعواتكم لي بالتوفيق والنجاح

لن أسامح أسامح من يقوم بالنقل بدون ذكر المصدر ( برامج فور يو ) ورابط الموضوع
لن أسامح أسامح من يقوم بالنقل بدون ذكر المصدر ( برامج فور يو ) ورابط الموضوع
لن أسامح أسامح من يقوم بالنقل بدون ذكر المصدر ( برامج فور يو ) ورابط الموضوع

المصدر : http://www.progs4u.net/vb/showthread.php?p=12520

فارس · 25-11-2010, 10:09 AM

لا الله الله
مبدع اخوي والكود هذا روعه لمحبين الاحتراف بالتصميم

خطوات سهلة · 25-11-2010, 01:38 PM

جميل جزاك الله الجنة

ساحر الاوطان · 25-11-2010, 02:30 PM

يسلموا علي الطرح

أدوات الموضوع
مشاهدة صفحة طباعة الموضوع أرسل هذا الموضوع إلى صديق
انواع عرض الموضوع
العرض العادي الانتقال إلى العرض المتطور الانتقال إلى العرض الشجري

كود حصرى لجعل صورة الخلفية للصفحة تتناسب مع حجم الشاشة بتقنية [ Css3 ]

الـسلام عليكم ورحمة الله وبركاته بسم الله الرحمن الرحيم ازيكم يا الغالين ،، إن شاء الله بخير دايـماً أقدم لكم