Last updated Nov. 27, 2014
الملاحظات
دروس تصميم وتطوير مواقع الويب
دروس عامة في تصميم وتهيئة وإعداد وتطوير هيكلة مواقع الويب، بواسطة تقنيات html, css, jquery and plugins

css archive - ارشيف سي اس اس، موسوعة css


اضافة رد
رقم المشاركة # 1  
أضيفت بتاريخ 02 - 10 - 2012 عند الساعة 19:59
صورة 'محمد الحلبي' الرمزية
محمد الحلبي
:: مراقب ::
أقسام تصميم وتطوير مواقع الويب التعليمية
محمد الحلبي غير متواجد حاليآ بالمنتدى
بيانات موقعي
اسم الموقع: Mohammed Alhalabi
اصدار المنتدى: منتج اخر
تاريخ الإنضمام: 21 - 12 - 2006
رقم العضوية : 29719
الدولة : حيث المظلومين [غزة]
المشاركات: 5,459
قوة السمعة : 11944
أرسل رسالة بواسطة MSN إلى محمد الحلبي أرسل رسالة بواسطة Yahoo إلى محمد الحلبي أرسل رسالة بواسطة Skype™ إلى محمد الحلبي
Icon30

  css archive - ارشيف سي اس اس، موسوعة css




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

في البداية فكرة الموضوع سهلة وبسيطة جدا

وهي أن نقوم بعمل أرشيف للـ css ، سي اس اس

الهدف من الموضوع أن نعمل أرشيف مع فائدة عمل كل كود، وطرق كتابة كل كود،،،

بدايةً سنشرح القليل عند الـ سي اس اس بشكل أساسي


ما هي لغة css ؟

css هي اختصار لـ Cascading Style Sheets والتي تعني [ صفحة الأنماط الانسيابية ]
أساليب تحديد كيفية عرض عناصر HTML
عملت على تخفيف أكواد html ليتم استبدالها بأكواد بسيطة وتشمل عدة عناصر.


بعض الحلول التي جاءت بها لغة css !

عندما كان مصمموا الويب قديما يستخدمون بعض اكواد html في الموقع واستخدام tag معين ووضع خصائص لهذا الـ tag فيجب أن يقوم بتكرار الخصائص لجميع الـ tags
مثال:
رمز Code:
<font color="#fff" size="3">محمد الحلبي -  ترايدنت</font>
في هذه الحالة القديمة كان المصمم يقوم بتكرار الكود في الموقع لكل عنصر معين، جاءت لغة css لتقوم بتوفير الوقت والجهد والعناء سواء في الكتابة أو التعديل فكان الحل مباشرة كالتالي:

رمز Code:
<font>محمد الحلبي - ترايدنت</font>
الحل:

رمز Code:
font{color:#fff;font-size:14px;}
الكود السابق عمل على حل مشكلة تكرار الكود في الموقع، ففي هذه الحالة يقوم بوضع الخصائص لجميع الـ tags باسم font


الصيغة الصحيحة لكتابة كود css

css archive - ارشيف سي اس اس، موسوعة csscss archive - ارشيف سي اس اس، موسوعة css


العنصر: وهو يكون عنصر html المراد عمل تغييرات عليه.
الخاصية: وهي نوع التغيير.
القيمة: قيمة التغيير

مثال على كتابة كود :


رمز Code:
p{color:#fff;font-size:14px;}
رمز Code:
p{
    color:#fff;
    font-size:14px;
}
كما نلاحظ أن في كلا الطريقتين فإن الكود يعمل بدون أي مشكلة، ولكن الذي يحدد عمل الكود هو بعض الرموز وهي كالتالي:
بعد الخاصية المراد تغييرها يجب أن نكتب علامة نقطتين :
وبعد القيمة نقوم بكتابة فاصلة منقوطة كي نحدد نهاية الخاصية ;


طريقة كتابة تعليق في css أي comment


رمز Code:
p{
    color:#fff; /* هنا تضع التعليق بدون أي مشكلة */
    font-size:14px;
}
كما نلاحظ أن التعليق يقع بين العلامة التالية:

رمز Code:
/* هنا نضع التعليق */


طريقة تحديد عنصر html المراد عمل تنسيقات عليه.


تتم هذه العملية بثلاث طرق

رمز Code:
<p id="traidnt" class="halabi">محمد الحلبي - ترايدنت</p>


الطريقة الأولى:


رمز Code:
p{
    color:blue;
    font-size:14px;
}
في الطريقة الأولى يقوم بوضع تلك الخصائص لكل الـ tags التي اسمها p

الطريقة الثانية:

رمز Code:
#traidnt{
    color:blue;
    font-size:14px;
}
في هذه الخاصية قمنا بتحديد عنصر html من خلال الـ id الخاص به

الطريقة الثالثة:


رمز Code:
.halabi{
    color:blue;
    font-size:14px;
}
في هذه الخاصية قمنا بتحديد عنصر html من خلال الـ class الخاص به

ما الفرق بين id و class ؟

الـ id : عبارة عن مسمى يعطى لعنصر الـ html وهو فريد ولا يجب أن يتكرر في الموقع أبدا، كما أنه لا يمكنك أن تعطي عنصر الـ html إلا id واحد فقط.

رمز Code:
<p id="traidnt"></p>


الـ class :
عبارة عن مسمى يعطى لعنصر html ويمكن تكراره بدون أي مشاكل، وعند وضع خصائص الـ css للـ class يتم توزيع تلك الخصائص لكل الـ classes التي تحمل نفس المسمى، كما أنه يمكن أن تعطي عنصر الـ html أكثر من class.


رمز Code:
<p class="traidnt halabi"></p>
<span class="traidnt"></span>
كيف تعمل على استخدام الـ css في الموقع؟
هناك ثلاث طرق لإدخال css

الطريقة الأولى: ورقة نمط خارجية مثالية يتم تطبيق النمط على عدة صفحات في الموقع، كما يمكنك تغيير مظهر ويب بأكمله عن طريق تغيير ملف واحد، يتم ذلك من خلال ربط ورقة الأنماط في الصفحات من خلال tag اسمه <link> يوضع في منطقة الـ head

رمز Code:
<head>
<link rel="stylesheet" type="text/css" href="traidnt.css" />
</head>
الطريقة الثانية: يمكنك استخدام خصائص الـ css من خلال صفحة الـ html بوضع الكود في الـ head من خلال العلامة <style>

رمز Code:
<head>
<style type="text/css">
.traidnt {color:sienna;}
p {margin-left:20px;}
body {background-color:gray;}
</style>
</head>
الطريقة الثالثة: وهي طريقة تضمين خصائص الـ css من خلال عنصر الـ html مباشرة.

رمز Code:
<p style="color:#06F;">محمد الحلبي - ترايدنت</p>
نبدأ على بركة الله في الأرشيف ...

1- الخلفيات Backgrounds

رمز Code:
background-attachment:fixed;
    background-color:blue;
    background-image:url(traidnt.png);
    background-position:right top;
    background-repeat:repeat-x;
1- background attachment : وهي تستخدم لكيفية وضع الخلفية، أي أن الخلفية تبقى ثابتة في المتصفح، او انها تتحرك مع تحريك سكرول المتصفح.
2- background color : وضع خلفية لون.
3- background image : وضع خلفية صورة.
4- background position : يحدد نقطة انطلاق الصورة الخلفية الخاصية الأولى (right) من اليسار حتى اليمين، والخاصية الثانية (top) من أعلى ثم أسفل.
5- background repeat : لتحديد كيف سيتم تكرار صورة الخلفية ( repeat-x = تكرار أفقي ) ، ( repeat-y = تكرار عمودي ) ، ( repeat = تكرار من كلا الاتجاهين ) ، ( no-repeat = عدم التكرار ).

طريقة كتابة الكود السابق في اختصار:

رمز Code:
background:blue url(traidnt.png) right top fixed no-repeat;
2- النصوص Text

رمز Code:
color:blue;
    text-align:center;
    text-decoration:underline;
    text-transform:uppercase;
    text-indent:50px;
1- color : تغيير لون الخط.
2- text align : وضع النص (وسط، يمين، يسار)
3- text decoration : وضع خط أسفل النص، أو خط وسط النص، أو خط أعلى النص، أو ازالة الخط.
4- text transform : جعل النص كله حروف كبيرة، او جعل النص كله حروف صغيرة، او جعل النصوص تبدأ أول حرف من كل كلمة كبير.
5- text indent : وهي ازاحة النص بقيمة معينة.

3- الخطوط Fonts

رمز Code:
font-family:Arial;
    font-style:italic;
    font-size:18px;
1- font-family : تحديد نوع الخط.
2- font-style : تحديد شكل الخط (مائل، عريض..)
3- font-size : تحديد حجم الخط.

طريقة كتابة الكود باختصار:

رمز Code:
font:italic 18px Arial;
4- الروابط Links

رمز Code:
a:visited {color:#00FF00;}
a:hover {color:#FF00FF;}
a:active {color:#0000FF;}
1- a:link : الرابط الافتراضي (لم تسبق زيارته).
2- a:visited : رابط تمت زيارته.
3- a:hover : عند وضع الماوس على الرابط.
4- a:active : رابط محدد (جارٍ الضغط عليه).

5- القوائم Lists

القائمة تتكون من نوعين، النوع الأول وهي نقطية، والنوع الثاني وهي رقمية.
مثال على القوائم (قائمة رقمية) :

  1. ترايدنت
  2. محمد الحلبي
  3. css
مثال على القوائم (قائمة نقطية) :

  • ترايدنت
  • محمد الحلبي
  • css


طريقة كتابة الصيغة الصحيحة لكل قائمة:

قائمة رقمية:

رمز Code:
<ol>
    <li>TRAIDNT</li>
    <li>TRAIDNT</li>
    <li>TRAIDNT</li>
    <li>TRAIDNT</li>
</ol>
قائمة نقطية:

رمز Code:
<ul>
    <li>TRAIDNT</li>
    <li>TRAIDNT</li>
    <li>TRAIDNT</li>
    <li>TRAIDNT</li>
</ul>
من خلال تقنية css يمكنك استخدام تنسيق html واحد فقط ويمكنك تحديده اما رقمية أو نقطية.

رمز Code:
list-style-type:circle;
list-style-image:url(traidnt.css);
list-style-position:inside;
1- list-style-type : تحديد نوع النمط.
2- list-style-image : وضع صورة للقائمة.
3- list-style-position : تحديد مكان التنقيط (خارج القائمة أو ضمن القائمة).

هناك مشكلة في كود list-style-image وهي أنه لا يعمل الكود السابق على جميع المتصفحات ويحتوى على الكثير من المشاكل، ولحل تلك المشكلة تكون من خلال التالي:

رمز Code:
ul
{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
ul li
{
    background: url(sqpurple.gif) right center no-repeat;
    padding-right: 14px; 
}
في هذه الطريقة نقوم بإزالة التنقيط الافتراضي للقائمة من خلال كود (list-style-type: none;) ومن ثم نضع الصورة التي نريدها لكل عنصر كما بالكود الثاني الخاص بالعنصر (ul li)

كما أننا يمكننا وضع حل آخر، وهو دمج الكودين في كود واحد، وذلك كـ شرط if أي عندما يكون المتصفح يدعم خاصية الصورة فيقوم بذلك عرض الصورة، وإن لم يدعمها فسيقوم وضع التنسيق الافتراضي، وذلك من خلال الكود التالي:

رمز Code:
ul
{
    list-style: square url("traidnt-list.gif");
}
6- الجداول Tables

رمز Code:
border: 1px solid black;
border-collapse:collapse;
width:90%;
height:500px;
text-align:right;
vertical-align:bottom;
background-color:green;
color:white;
1- border : نقوم بوضع حدود وذلك لثلاث عناصر من الجدول وهي (الجدول table ، الصف tr ، الخلية td).
2- border-collapse : في الحالة الافتراضية عند انشاء جدول من خلال html يكون للجدول فراغات بين كل خلية والأخرى، من خلال هذه الخاصية واختيار القيمة collapse يمكنك أزالة تلك الفارغات.
3- width : كما يمكنك تحديد العرض للعناصر الثلاثة في الجدول (table, tr, td) من خلال نسبتين، إما بالبيكسل، او بالنسبة المئوية.
4- height : أيضا يمكنك تحديد الارتفاع للعناصر الثلاثة.
5- text-align : وهي لتحديد اتجاه النص (يمين، يسار أو وسط)، وتستخدم بالغالب لـ الخلية td.
6- vertical-align : تعمل على تحديد النص عموديا (أعلى، وسط أو أسفل) الخلية، وبالغالب تستخدم للخلية td.
7- background : كما يمكنك تغيير الخلفية للعناصر الثلاثة في الجدول مرة واحدة من خلال تغييرها لـ table، أو تخصيص خلفية لكل عنصر على حدا.
8- color : تمكنك من تغيير لون النص للعناصر الثلاثة.



7- صندوق النموذج Box Model

ويمكن اعتبار جميع عناصر HTML كمربعات في CSS، يتم استخدام مصطلح "نموذج الصندوق" عندما نتحدث عن التصميم والتخطيط.

نموذج الصندوق CSS هي في جوهرها المربع الذي يلتف حول عناصر HTML، ويتكون من: هوامش والحدود والحشو، والمحتوى الفعلي.

نموذج الصندوق يتيح لنا وضع حد حول العناصر وعناصر الفضاء فيما يتعلق العناصر الأخرى.

الصورة أدناه يوضح نموذج الصندوق:


css archive - ارشيف سي اس اس، موسوعة css
  • Margin : حجز منطقة خلف الحدود، الـ margin ليس له لون خلفية، فهو منفرد عن الـ box.
  • Border : الحدود التي تدور حول ( الحشو padding و المحتوى content) وهو يكون من ضمن الـ box.
  • Padding: حجز منطقة حول المحتوى ويتم احتسابها من ضمن الـ box، كما أنها تأخذ نفس لون الـ box.
  • Content: محتوى الـ box وهي التي تعرض النصوص والصور والفيديوهات.

بهذا القدر نستطيع معرفة أغلب أكود الـ css ، ولإتقانها يجب التجربة أكثر من مرة وملاحظة التغيرات.

الموضوع بالكامل من كتابتي وتقديري وجهدي، فإن كانت هناك أخطاء فلا تلوموني فأنا بشر.
وسأقوم بكتابة المزيد من الأكواد أيضا في نفس الموضوع، وسأقوم بعمل أرشيف آخر في وقت لاحق لـ
css3.

أفكاركم واقتراحاتكم تهمنا جميعا، فلنعمل معا وسويا من أجل التعليم والتطور بإذن الله تعالى.

وتقبلوا خالص تحياتي وتقديري لكمـ،،،
الصور المصغرة المرفقة
اضغط على الصورة المصغرة لمشاهدتها بحجمها الأصلي
اسم الصورة : syntax.jpg
عدد المشاهدات : 2654
حجم الصورة : 67.7 كيلوبايت
رقم هوية الصورة : 667205   اضغط على الصورة المصغرة لمشاهدتها بحجمها الأصلي
اسم الصورة : box-model.png
عدد المشاهدات : 3359
حجم الصورة : 13.8 كيلوبايت
رقم هوية الصورة : 667206  
تميز في ركن مشاكل أكواد التصميم
ترقبوا ترايدنت 2015
----------------
تواصل معي من خلال البريد: [email protected]
شكرا ترايدنت، شكرا كليبرز
شكرا: http://upload.traidnt.net/upfiles/Snu04960.png
التعديل الأخير كان بواسطة محمد الحلبي; 02 - 10 - 2012 الساعة 21:16
أضيفت بتاريخ 02 - 10 - 2012 عند الساعة : 21:25
رقم المشاركة # 2
:: عضو نشيط ::
صورة 'Solar Attack' الرمزية
تاريخ الإنضمام: 15 - 07 - 2009
رقم العضوية : 66092
الدولة : الشرقية-الجبيل
المشاركات: 3,373
قوة السمعة : 283
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
رائع جدا ،،

مساند اليك ايضا ،،

تثبيت (مدة غير محدودة) + تقييم ..

بارك الله فيك ،،
أضيفت بتاريخ 03 - 10 - 2012 عند الساعة : 02:04
رقم المشاركة # 3
:: عضو نشيط ::
صورة 'Des-manal' الرمزية
تاريخ الإنضمام: 04 - 06 - 2012
رقم العضوية : 142880
الدولة : KSA
المشاركات: 353
قوة السمعة : 52
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
موضوع راااائع الله يعطيك العافيه
و يجزاك كل خير

اعجاب + تقييم
أضيفت بتاريخ 03 - 10 - 2012 عند الساعة : 03:47
رقم المشاركة # 4
:: صاحب موقع إستضافه ::
صورة '4Serv.Net' الرمزية
تاريخ الإنضمام: 03 - 03 - 2010
رقم العضوية : 79639
الدولة : EgYpT
المشاركات: 2,014
قوة السمعة : 337
أرسل رسالة بواسطة MSN إلى 4Serv.Net
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
يعطيك الف عافية والله ,,
  • تاريخ الإنضمام لمجموعة الأستضافة: 1/1/2013
  • نوع الخادم : Dedicated Server
  • إسم الشركة: فور سيرف لخدمات الويب المتكامله
  • صاحب الشركة: محمد محسن محمود
  • خدمات الشركة: استضـافة - ريسيلـر - سيرفرات مشتركة - سيرفرات كاملـة - دعم فنى - ادارة وحماية خوادم
  • مقر الشركة : الدقهليـه - المنصـورة
  • هاتف الشركة : داخل مصر 01064502736 - خارج مصر 002010645024736
  • بريد الشركة : [email protected]
  • الدعم الفني : فور سيرف لخدمات الويب المتكامله | فور سيرف لخدمات الويب المتكامله
  • روابط الشركة : 4serv.net - 4serv.org
  • خانه إضافيه : خدمات ومواصفـات عربيـة بنظـرة عـالميـة
أضيفت بتاريخ 03 - 10 - 2012 عند الساعة : 07:29
رقم المشاركة # 5
:: عضو نشيط ::
صورة 'معتز صقر' الرمزية
تاريخ الإنضمام: 10 - 09 - 2010
رقم العضوية : 84890
الدولة : لـيـبـيـا
العمر: 3
المشاركات: 3,148
قوة السمعة : 92
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
بالرغم من خبرتي في السي اس اس لكني وجدت الموضوع مفيدا جدأأ يا الغالي مشكور ويستحق التثبيت وبجداره
( أنا : motaz-ash )


لــــيــ
ـــبــــيـــــبـــــا

أضيفت بتاريخ 03 - 10 - 2012 عند الساعة : 11:48
رقم المشاركة # 6
:: مراقب ::
أقسام تصميم وتطوير مواقع الويب التعليمية
صورة 'محمد الحلبي' الرمزية
تاريخ الإنضمام: 21 - 12 - 2006
رقم العضوية : 29719
الدولة : حيث المظلومين [غزة]
المشاركات: 5,459
قوة السمعة : 11944
أرسل رسالة بواسطة MSN إلى محمد الحلبي أرسل رسالة بواسطة Yahoo إلى محمد الحلبي أرسل رسالة بواسطة Skype™ إلى محمد الحلبي
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
رائع جدا ،،

مساند اليك ايضا ،،

تثبيت (مدة غير محدودة) + تقييم ..

بارك الله فيك ،،
حياك الله يا رب

صراحة خجلتني كتير،،،

ربنا يجزيك كل خير

موضوع راااائع الله يعطيك العافيه
و يجزاك كل خير

اعجاب + تقييم
تسلمي يا رب

مرورك ع الموضوع أجمل من الموضوع

الله يعافيك يا رب

حياك الله على المرور الطيب

بالرغم من خبرتي في السي اس اس لكني وجدت الموضوع مفيدا جدأأ يا الغالي مشكور ويستحق التثبيت وبجداره
بارك الله فيك على المرور

قد ما الواحد يقول عن حاله خبير فيجد نفسه ما زال يحتاج للعلم

واتمنى التفاعل، وان نسيت أي كود انا فليطرحه الأخوة ولتعم الفائدة بإذن الله تعالى
تميز في ركن مشاكل أكواد التصميم
ترقبوا ترايدنت 2015
----------------
تواصل معي من خلال البريد: [email protected]
شكرا ترايدنت، شكرا كليبرز
شكرا: http://upload.traidnt.net/upfiles/Snu04960.png
التعديل الأخير كان بواسطة محمد الحلبي; 03 - 10 - 2012 الساعة 12:46
أضيفت بتاريخ 05 - 10 - 2012 عند الساعة : 00:30
رقم المشاركة # 7
.:: عضو متألق ::.
صورة 'سليم القرم' الرمزية
تاريخ الإنضمام: 28 - 09 - 2007
رقم العضوية : 38832
الدولة : ❤TRAIDNT
المشاركات: 6,550
قوة السمعة : 317
أرسل رسالة بواسطة MSN إلى سليم القرم
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
محمد الحلبى

فن + خبرة + دراسة + تميز

ملاحظة :
محمد الحلبى الاول على قسم تكنولوجيا المعلومات بدرجة امتياز بكلية المجتمع
فى المقدمة دائما اخوى محمد
و بإنتظارك ابداعاتك القادمة
التى من شأنها الارتقاء بمعهد ترايدنت الى اعالى السماء
بارك الله فيك
وجعلك ذخراً لمعهدنا الغالى

بالتوفيق للجميع
| شرح زراعه أمر |
| شرح تعطيل الهاكات من الكونفيق |
[ شرح ] سحب مواضيع منتداك تلقائيا للبيج الخاص بموقعك على الفيس بوك عن طريق rss graffiti 2.0 [شرح مصور]
[ درس ] عمل أرشفة إحترافية لموقعك بأسرع وقت ممكن
[ شرح ] زين منتداك بأجمل الابتسامات وايقونات المشاركة + شرح طريقة التركيب

للمراسلة : [email protected]

أو من هنا :
سليم القرم mypage
أضيفت بتاريخ 05 - 10 - 2012 عند الساعة : 03:16
رقم المشاركة # 8
عضو تحت التدريب
تاريخ الإنضمام: 08 - 02 - 2012
رقم العضوية : 111882
الدولة : لو لم أكن مسلمالوددت أن أكون مسلما
المشاركات: 1,580
قوة السمعة : 64
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
بارك الله فيك كدة أنت صح ياريت الكل ينتهج نهجك ويحذو حذوك ..إحتراماتي..
أضيفت بتاريخ 05 - 10 - 2012 عند الساعة : 17:02
رقم المشاركة # 9
:: عضو نشيط ::
صورة 'adeleqo' الرمزية
تاريخ الإنضمام: 15 - 10 - 2009
رقم العضوية : 73870
العمر: 36
المشاركات: 1,173
قوة السمعة : 56
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
ما شاء الله عليك اخي محمد وزادك الله من نعيمه وعلمه دائماً ....
يا ريت تتطرق للاكواد عند تحويلها كصور ( ان صح التعبير ) بحيث نظهرها دائماً حتى لو وجد اكواد او صور اسفلها .

relative و absolute

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


الحمد لله استفدت من اول ارشيف الكثير والحمد لله خاصه لاني متابع معك في الدوره
والحمد لله انتهينا من النقاط التي اشرت لك عليها وقلت انك ستشرحها في النهاية

رمز Code:
list-style-type: none
فشكراً واحلى تقييم واحلى لايك مع انها كلها قليله عليك .
[email protected]
أضيفت بتاريخ 07 - 10 - 2012 عند الساعة : 10:17
رقم المشاركة # 10
:: مراقب ::
أقسام تصميم وتطوير مواقع الويب التعليمية
صورة 'محمد الحلبي' الرمزية
تاريخ الإنضمام: 21 - 12 - 2006
رقم العضوية : 29719
الدولة : حيث المظلومين [غزة]
المشاركات: 5,459
قوة السمعة : 11944
أرسل رسالة بواسطة MSN إلى محمد الحلبي أرسل رسالة بواسطة Yahoo إلى محمد الحلبي أرسل رسالة بواسطة Skype™ إلى محمد الحلبي
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
محمد الحلبى

فن + خبرة + دراسة + تميز

ملاحظة :
محمد الحلبى الاول على قسم تكنولوجيا المعلومات بدرجة امتياز بكلية المجتمع
فى المقدمة دائما اخوى محمد
و بإنتظارك ابداعاتك القادمة
التى من شأنها الارتقاء بمعهد ترايدنت الى اعالى السماء
بارك الله فيك
وجعلك ذخراً لمعهدنا الغالى

بالتوفيق للجميع

والله يا سليم أحرجتني ،،،

ع العموم مرورك على الموضوع أعطاه رونقه العالي والجذاب

حياك الله يا سليم ...
تميز في ركن مشاكل أكواد التصميم
ترقبوا ترايدنت 2015
----------------
تواصل معي من خلال البريد: [email protected]
شكرا ترايدنت، شكرا كليبرز
شكرا: http://upload.traidnt.net/upfiles/Snu04960.png
أضيفت بتاريخ 07 - 10 - 2012 عند الساعة : 10:20
رقم المشاركة # 11
:: مراقب ::
أقسام تصميم وتطوير مواقع الويب التعليمية
صورة 'محمد الحلبي' الرمزية
تاريخ الإنضمام: 21 - 12 - 2006
رقم العضوية : 29719
الدولة : حيث المظلومين [غزة]
المشاركات: 5,459
قوة السمعة : 11944
أرسل رسالة بواسطة MSN إلى محمد الحلبي أرسل رسالة بواسطة Yahoo إلى محمد الحلبي أرسل رسالة بواسطة Skype™ إلى محمد الحلبي
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
بارك الله فيك كدة أنت صح ياريت الكل ينتهج نهجك ويحذو حذوك ..إحتراماتي..

حياك الله يا رب
نيتي خالصة من أجل نشر العلم مهما كلفني من إفشاء خبرة أو أسرار فالمهم الفائدة

ما شاء الله عليك اخي محمد وزادك الله من نعيمه وعلمه دائماً ....
يا ريت تتطرق للاكواد عند تحويلها كصور ( ان صح التعبير ) بحيث نظهرها دائماً حتى لو وجد اكواد او صور اسفلها .

relative و absolute

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


الحمد لله استفدت من اول ارشيف الكثير والحمد لله خاصه لاني متابع معك في الدوره
والحمد لله انتهينا من النقاط التي اشرت لك عليها وقلت انك ستشرحها في النهاية

رمز Code:
list-style-type: none
فشكراً واحلى تقييم واحلى لايك مع انها كلها قليله عليك .
حياك الله على مرورك الطيب يا طيب

ولكن وضحلي أكثر بخصوص بند عند تحويلها لصور

هل تقصد مثلا وضع صورة وفوقها نضع نص أو مختصر بخصاية الـ absolute

وضحلي كويس وفورا بإذن الله راح اعمل على شرحها ....
adeleqo معجب بهذا.
تميز في ركن مشاكل أكواد التصميم
ترقبوا ترايدنت 2015
----------------
تواصل معي من خلال البريد: [email protected]
شكرا ترايدنت، شكرا كليبرز
شكرا: http://upload.traidnt.net/upfiles/Snu04960.png
أضيفت بتاريخ 07 - 10 - 2012 عند الساعة : 14:25
رقم المشاركة # 12
:: عضو نشيط ::
صورة 'احمد شناق' الرمزية
تاريخ الإنضمام: 15 - 03 - 2012
رقم العضوية : 121881
الدولة : الاردن - اربد
المشاركات: 673
قوة السمعة : 52
أرسل رسالة بواسطة Yahoo إلى احمد شناق أرسل رسالة بواسطة Skype™ إلى احمد شناق
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
يعجز اللسان عن وصف هذا الابداع

مشكوووور يا غالي ... بس سؤال : هل اذا فهمت هذا الموضوع أفهم لغة الـ css كامله ؟؟
صلوّا على رسول الله " محمد " صلى الله عليه وسلم ♥
أضيفت بتاريخ 07 - 10 - 2012 عند الساعة : 14:51
رقم المشاركة # 13
:: مراقب ::
أقسام تصميم وتطوير مواقع الويب التعليمية
صورة 'محمد الحلبي' الرمزية
تاريخ الإنضمام: 21 - 12 - 2006
رقم العضوية : 29719
الدولة : حيث المظلومين [غزة]
المشاركات: 5,459
قوة السمعة : 11944
أرسل رسالة بواسطة MSN إلى محمد الحلبي أرسل رسالة بواسطة Yahoo إلى محمد الحلبي أرسل رسالة بواسطة Skype™ إلى محمد الحلبي
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
يعجز اللسان عن وصف هذا الابداع

مشكوووور يا غالي ... بس سؤال : هل اذا فهمت هذا الموضوع أفهم لغة الـ css كامله ؟؟
تقريبا هذه أغلب أكواد الـ css توكل على الله وتعلمها

وحياك الله على المرور الطيب
احمد شناق معجب بهذا.
تميز في ركن مشاكل أكواد التصميم
ترقبوا ترايدنت 2015
----------------
تواصل معي من خلال البريد: [email protected]
شكرا ترايدنت، شكرا كليبرز
شكرا: http://upload.traidnt.net/upfiles/Snu04960.png
أضيفت بتاريخ 07 - 10 - 2012 عند الساعة : 23:17
رقم المشاركة # 14
:: عضو نشيط ::
صورة 'adeleqo' الرمزية
تاريخ الإنضمام: 15 - 10 - 2009
رقم العضوية : 73870
العمر: 36
المشاركات: 1,173
قوة السمعة : 56
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css

حياك الله على مرورك الطيب يا طيب

ولكن وضحلي أكثر بخصوص بند عند تحويلها لصور

هل تقصد مثلا وضع صورة وفوقها نضع نص أو مختصر بخصاية الـ absolute

وضحلي كويس وفورا بإذن الله راح اعمل على شرحها ....

نعم بالضبط اخي هذا المطلوب ....
فاحياناً مثلاً نعم تأطير يكون فيه صور على اليسار واليمين ويكون هنالك مثلاً كلام على التأطير واذا على فرض انه هالكلام كان اعرض من ال( التمدد ) ما رح يطلع على صور الزوايا وبيكون في تشوه في التصميم .


ويا ريت لو ايضاً تضع لنا اكواد خاصه بعمل السي اس اس على المتصفحاتالمنوعه .
[email protected]
أضيفت بتاريخ 08 - 10 - 2012 عند الساعة : 02:52
رقم المشاركة # 15
:: المركز الثاني بمسابقة ركن الإستايلات ::
صورة 'اورجينال' الرمزية
تاريخ الإنضمام: 01 - 10 - 2008
رقم العضوية : 61113
الدولة : A L B A H A ~
المشاركات: 6,710
قوة السمعة : 3209
أرسل رسالة بواسطة MSN إلى اورجينال أرسل رسالة بواسطة Yahoo إلى اورجينال أرسل رسالة بواسطة Skype™ إلى اورجينال
افتراضي  رد : css archive - ارشيف سي اس اس، موسوعة css
وعليكم السلام ~

ماشاء الله عليك مبدع والله يالغالي

والله يوفقك دنيا واخره ي مبدع

وجاري التجربه

تحياتي لك ~
اضافة رد

العلامات المرجعية

css archive - ارشيف سي اس اس، موسوعة css


« خاصية Border-radius Css3 [حـصري] html5-slideshow »

أدوات الموضوع
طرق العرض

غلق/فتح (الكل) ضوابط المشاركة
لا يمكنك اضافة مواضيع جديدة
لا يمكنك اضافة مشاركات
لا يمكنك اضافة مرفقات
لا يمكنك تعديل مشاركاتك

رمز [IMG] : متاحة
رمز HTML : معطّلة
المراجع : معطّلة
Refbacks are متاحة



الساعة معتمدة بتوقيت جرينتش +3 . الساعة الآن : 07:17.
المعهد غير مسؤول عن أي اتفاق تجاري أو تعاوني بين الأعضاء
فعلى كل شخص تحمل مسئولية نفسه إتجاه مايقوم به من بيع وشراء وإتفاق وأعطاء معلومات موقعه
التعليقات المنشورة لا تعبر عن رأي معهد ترايدنت ولا نتحمل أي مسؤولية قانونية حيال ذلك (ويتحمل كاتبها مسؤولية النشر)


Powered by vBulletin® Version 3.8.7 .Copyright ©2000 - 2014, Jelsoft Enterprises Ltd
SEO by vBSEO ©2011, Crawlability, Inc.
Google
‪Google+‬‏