تغطية مباشرة لأحداث منتدى الإعلام الجديد المقام بمدينة أبوظبي
هل تقترح تمديد مسابقة سوالف كاست؟

 

العودة   سوالف سوفت > قسم تطوير وبرمجة المواقع للمتقدمين > تطوير الويب
المدوّنات البحث مشاركات اليوم اجعل كافة المشاركات مقروءة

رد  
 
LinkBack أدوات الموضوع
عضو نشيط
تاريخ التسجيل: Jun 2004-
#1 (permalink)  
الحدود في الـ CSS3


السلام عليكم جميعاً...
بعد انتشار الـ CSS1 و بعدها الـ CSS2... جاري العمل الآن على النسخه الثالثه من هذه التقنية...

في هذا الموضوع سأسرد بعض المميزات التي تتميز بها هذه النسخه الحديثه بالنسبة للحدود (borders)... بالإضافه إلى ما تميزت به النسختين السابقتين..

لون الحدود - border-color
-----------------------------------
border-top-color - لون الحد العلوي..
border-bottom-color - لون الحد السفلي
border-right-color - لون الحد للجهه اليمين
border-left-color - لون الحد للجهه اليسرى
border-color - لون جميع الحدود

- القيمة لهذه الخيارات يجب أن تكون عباره عن لون بغض النظر كانت هذه القيمة إسماً أو # او Rgb...
- يمكن تطبيق هذه الخيارات لجميع العناصر التي يمكن استخدامها (مثال: <p></p>)...
- بحال كان اللون trasparent ... فإن لون الخلفيه هو الذي سيكون ظاهراً...


ستايل الحدود - border-style
-----------------------------------
- لون الحد العلوي..
border-bottom-style -ستايل الحد السفلي
border-right-style - ستايل الحد للجهه اليمين
border-left-style - ستايل الحد للجهه اليسرى
border-style - ستايل جميع الحدود

- القيم التي يمكن استخدامها هي:


ملاحظه: التحكم بالمسافه بين النقطه و الأخرى .. او طول الخط مازال غير ممكن...
ملاحظه أخرى: و هو أنه لا يوجد طريقة يمكن الإعتماد عليها لتعريف المتصفح كيفية إظهار الحدود بحال كان كل منهم من نوع مختلف...

الزاوية المستديره للحدود - border-radius
------------------------------------------------
border-top-right-radius - الزاوية المستديره العليا اليمنى
border-bottom-right-radius - الزاوية المستديره السفلى اليمنى
border-bottom-left-radius - الزايويه المستديره السفلى اليسرى
border-top-left-radius - الزاويه المستديره العليا اليسار
border-radius - الزاويه المستديره لجميع الحدود

- القيم التي يجب استخدامها هي عباره عن مقاسين لطول و عرض ربع الشكل البيضاوي.. كمان موضح بالصوره التاليه:



صورة الحدود - border-image
-------------------------------------
border-top-image - صورة للحد العلوي
border-right-image - صورة للحد الأيمن
border-bottom-image - صورة للحد السفلي
border-left-image - صورة للحد الأيسر
border-image - صورة لجميع الحدود

أما للزوايا فالخيارات هي:

border-top-left-image - صورة الزاوية العليا اليسرى
border-top-right-image - صورة الزاوية العليا اليمنى
border-bottom-right-image - صورة الزاوية السفلى اليمنى
border-bottom-left-image - صورة الزاوية السفلى اليسرى
border-corner-image - صورة لجميع للزوايا الأربعه


- القيمة المفروض استخدامها هي عنوان الصورة - مثال: url(images/bg.gif)

- مثال على صور الحدود:


الظل - box-shadow
------------------------------
box-shadow - لإظهار ظل للمربع المطبق عليه هذا الخيار...

- القيم الواجب استخدامها هي طول الظل المطلوب من كل جهه... بالإضافه إلى لون الظل..

مثال على الظل:

كود:
span {border: thin solid; box-shadow: 0.2em 0.2em #CCC}
و النتيجه:




اذا أردت أن تعرف المزيد عن هذا الموضوع... فتفضل إلى هذه الصفحه:
http://www.w3.org/TR/css3-border/

أخيراً... أعتذر عن الترجمه السيئه للمصطلحات... و باذن الله سأبدأ بتعلم الترجمه العربية لها قريبا....


الشكر الجزيل لكم....

عماد الصدر






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 04-01-2005, 06:56 AM
رد مع اقتباس
عضو سوبر نشيط
تاريخ التسجيل: Aug 2004-
#2 (permalink)  

تسلم .. ومشكور على هالمعلومات الجميلة بحق



عندي سؤال : هل هذه الإمكانيات غير متوفرة في الـ HTML ؟!

وهل هي فقط متوفرة في الـ CSS النسخه الجديدة ؟! وإذا كانت CSS جديدة فكيف يتم دعمها من خلال المتصفحات ؟!






__________________
نحن أمة إقرأ التي لا تقرأ
مبرمج إنترنت غير متواجد حالياً   قديم 04-01-2005, 01:03 PM
رد مع اقتباس
مـراقـب
تاريخ التسجيل: Apr 2001-
#3 (permalink)  

عليكم السلام
موضوع رائع اخي العزيز يستاهل تثبيت






__________________
لاَ اِلَهَ اِلاَّ اَنْتَ سُبْحَانَكَ اِنِّي كُنْتُ مِنَ الظَّالِمِينَ
===
شبكة دندون
Fuga غير متواجد حالياً   قديم 04-01-2005, 01:17 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Feb 2003-
#4 (permalink)  
عليكم السلام

موضوع ولا أحلى ما شاء الله عليك



ملاحظة: أخوي إذا ممكن تضيفني على البريد في التوقيع






__________________
رقيم

مجتمع فصول ملونة
أطلق العنان لإبدعك !!

rageem(at)gmail.com
رقيم غير متواجد حالياً   قديم 04-01-2005, 02:07 PM
رد مع اقتباس
عضو سوبر نشيط
تاريخ التسجيل: Aug 2002-
#5 (permalink)  

الله يجزاك الخير


بالفعل هذا ماكنت ابحث عنه ...


موضوع ثري حقيقه وراح يوفر الكثير






BOMBER غير متواجد حالياً   قديم 04-01-2005, 03:47 PM
رد مع اقتباس
مشرف قسم تطوير المواقع
تاريخ التسجيل: Feb 2003-
#6 (permalink)  

ممتاز اخي عماد
موضوع مميز و مفيد

بارك الله فيك






__________________
-{Only God Can Judge Me}-
القانون فوق الجميع و الجميع يموت بالجوع
Dr-dre67 غير متواجد حالياً   قديم 04-01-2005, 05:29 PM
رد مع اقتباس
عضو فعال جدا
تاريخ التسجيل: May 2004-
#7 (permalink)  

الله يعطيك العافية درس جميل و مفيد جدا ....
تحياتي






__________________
لاَ اِلَهَ اِلاَّ اَنْتَ سُبْحَانَكَ اِنِّي كُنْتُ مِنَ الظَّالِمِينَ
Hossam AL-Abdeh غير متواجد حالياً   قديم 04-01-2005, 10:08 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Nov 2003-
#8 (permalink)  

موضوع قيم ومعلومات قوية
جهد تستحق الشكر عليه
الله يعطيك العافية






__________________
روابط لـ اشهار المواقع
www.addlinkat.com
انشر موقعك في الف دليل عربي ومحرك بحث عالمي
مع تركيب دليل مواقع اندكسيو مؤلف من 20 الف موقع مشروح
و243 تصنيف
ماسنجر
add_link@hotmail.com
addlinkat غير متواجد حالياً   قديم 04-01-2005, 11:42 PM
رد مع اقتباس
عضو فعال
تاريخ التسجيل: Apr 2004-
#9 (permalink)  

الله يجزاك خير يابعدهم كلهم

صراحة شوقتني في تعلم المزيد منها .. عل وعسى ان نستغني ولو بحد كبير عن الصور

تشكرات






__________________
k_l_l_o_ll @ hotmail.com
فن التصميم
ياقلبي غير متواجد حالياً   قديم 05-01-2005, 02:21 AM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Jun 2004-
#10 (permalink)  

السلام عليكم جميعاً...

مبرمج إنترنت: شكري لك على ردك..
و بالنسبه للسؤال... فالإتش تي إم إل لا يمكنها القيام بهذه الأمور... و ذلك لإنه يراد لها أن يتركز عملها الآن فقط في المحتويات... و بالنسبه للسي إس إس فتصبح هي اللغه التي تقوم بعمل التصميم و وضع العناصر في اماكنها..
فيصبح ملف الإتش تي إم إل.. عباره عن ملف معلومات و محتويات.. و ملف السي إس إس هو ملف تصميم هذه المحتويات بالصفحه...
أما بالنسبه للمتصفحات... فعلى علمي أنه جميع المتصفحات مازالت لا تدعم هذه النسخه من السي إس إس .. عدا متصفح واحد و هو الموزيلا.. و هناك متصفحان آخران يدعمانها.. لكن بشكل جزئي.. و هما الفاير فوكس... و السفاري..

Fuga: شكرا لك عزيزي... و أشكر المراقبين على تثبيت الموضوع... (الصراحه ما توقعت انه يتثبت )

رقيم: إنت الأروع أخوي... و تمت الإضافه..

Bomber: إن شاء الله دائما نكون عند حسن ظنك... و ما تنسونا من الدعاء...

Dr-dre67: أهلا بيك مشرفنا العزيز... و أشكرك على التثبيت إن كنت انت من ثبته.. و بحال كان أي مراقب آخر .. فمازلت أريد أن أشكرك كونك أحد مشرفي هذا المنتدى... (يحاول يزبط وضعه مع الحكومه )

حسام: يعطيك العافيه عمي... و يا ريت تشوفلنا كم مواقع تمبليتات سي إس إس بطريقك ...

رامي: الشكر لازم يكون لرب العالمين اللي وفقني إني أكتب هذا الموضوع... تحيتي و سلامي لك...

يا قلبي: الله يجزي جميع عباده الخير... و أنا متشوق أكثر منك إني أبدأ استخدامها...
و الصراحه أتوقع إن الصور بالقريب رح ينعدم استخدامها في عمل تصميم الصفحه... و رح ينحصر بالإستخدامات الضروريه مثل الصور الفوتوجرافيه.. أو صور الشعارات و هذه الأمور... و إن شاء الله خير...

شكري الجزيل لكم جميعا مره أخرى..

سلام عليكم

عماد الصدر






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 05-01-2005, 11:41 AM
رد مع اقتباس
عضو سوبر نشيط
تاريخ التسجيل: Aug 2004-
#11 (permalink)  

طيب متى بنشوف IE 7.0 ؟!






__________________
نحن أمة إقرأ التي لا تقرأ
مبرمج إنترنت غير متواجد حالياً   قديم 05-01-2005, 11:46 AM
رد مع اقتباس
عضو سوبر نشيط
تاريخ التسجيل: Oct 2003-
#12 (permalink)  
...

انا شايف الموضوع هذا في مكان ثاني

بس مو متاكد ... ... على العموم الله يعطيك العافية






mr graphics غير متواجد حالياً   قديم 05-01-2005, 03:40 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Jun 2004-
#13 (permalink)  

مبرمج إنترنت: الصراحه أخوي ما اعرف..!
لكنك يمكنك انت تشوف من موقع تطوير الإنترنت اكسبلورر:
http://msdn.microsoft.com/ie/

يعطيك العافيه..


mr graphics: أنا أقللك وين... هنا:
http://www.pxll.com/vb/showthread.php?t=53



شكراً لك على ردك...


سلام..
عماد الصدر






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 05-01-2005, 03:46 PM
رد مع اقتباس
عضو سوبر نشيط
تاريخ التسجيل: Jun 2003-
#14 (permalink)  

السلام عليكم ورحمة الله ...

مقال متميــز شكراً جزيــلاً لك ..

تحياتي ...

BoO_SuLtAn






BoO_SuLtAn غير متواجد حالياً   قديم 05-01-2005, 08:42 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Jun 2004-
#15 (permalink)  

الشكر لك عزيزي BoO_SuLtAn على ردك...

عماد الصدر






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 06-01-2005, 01:11 PM
رد مع اقتباس
عضو فعال
تاريخ التسجيل: Jun 2003-
#16 (permalink)  

باركك الله ...


لقد أعجبتني مواضيعك و كتاباتك في ال blog الخاص بك ، غنها بالفعل ممتعه ...

خصوصاً "يا أحمق..اضغط هنا!"






__________________
سبحان الله و بحمده سبحان الله العظيم .
random-x@hotmail.com
-------------
دع عنك الإستعجال
random_X غير متواجد حالياً   قديم 06-01-2005, 03:59 PM
رد مع اقتباس
عضو سوبر نشيط
تاريخ التسجيل: Dec 2004-
#17 (permalink)  

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






فهد 2000 غير متواجد حالياً   قديم 07-01-2005, 01:22 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Jun 2004-
#18 (permalink)  

بارك الله فيكما أخوي random_x و فهد2000...



عماد الصدر






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 07-01-2005, 05:26 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Dec 2004-
#19 (permalink)  

جزاك الله خير






Z i y a d غير متواجد حالياً   قديم 09-01-2005, 05:53 PM
رد مع اقتباس
عضو فعال جدا
تاريخ التسجيل: Dec 2000-
#20 (permalink)  

ماشاءالله ..
ياليت كل مواضيع سوالف بنفس القيمة المعرفية لهذا الموضوع ..

شكراً لك أستاذ isader.com ..






رضا غير متواجد حالياً   قديم 10-01-2005, 10:53 AM
رد مع اقتباس
عضو فعال جدا
تاريخ التسجيل: Dec 2004-
#21 (permalink)  

شكرا لك على مجهودك والمعلومات القيمة فعلا يا اخ insader






__________________
....
محمد حسام
انترنت بلس
إنترنت بلس غير متواجد حالياً   قديم 12-01-2005, 01:25 AM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Jun 2004-
#22 (permalink)  

ksa15.cOm: تسلم أخوي....

رضا: إن شاء الله بتصير جميع المواضيع بنفس هذه الفائده.. و أكثر بإذن الله..

إنترنت بلس: العفو عزيزي... و إن شاء الله نكون دائما عند حسن ظنك...


شكراً لكم جميعاً...

عماد الصدر






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 12-01-2005, 01:03 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Dec 2004-
#23 (permalink)  

Thanx is usfeul articl

al-marwa.net






__________________
المروه.نت تقديم خدمات تقنية المعلومات و التجارة الالكترونية
www.almarwa.net.sa
al-marwa غير متواجد حالياً   قديم 12-01-2005, 02:01 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Jun 2004-
#24 (permalink)  

العفو عزيزي المروى...






__________________
معاً لإنترنت عربية أفضل...

معلومات مهمة عن أدوار فريق العمل في مواقع الويب
http://www.swalif.net/softs/showthread.php?t=120925
isader.com غير متواجد حالياً   قديم 13-01-2005, 02:27 PM
رد مع اقتباس
عضو نشيط
تاريخ التسجيل: Nov 2003-
#25 (permalink)  

موضوع مفيد


سلمت يداك
.
.
.






__________________
حياتي بلا أغاني
www.No4Songs.ws
خوخ غير متواجد حالياً   قديم 02-02-2005, 01:13 PM
رد مع اقتباس
رد


 

أدوات الموضوع

تعليمات المشاركة
لا تستطيع كتابة مواضيع
لا تستطيع كتابة ردود
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

كود [IMG] متاحة
كود HTML معطلة
Trackbacks are متاحة
Pingbacks are متاحة
Refbacks are متاحة



الساعة الآن: 08:12 AM بتوقيت المملكة العربية السعودية