كولا ماكس ||سودانية الملامح .. عالمية الروئة ®


سودانية الملامح .. عالمية الروئة ®
 
الرئيسيةالرئيسية  اليوميةاليومية  س .و .جس .و .ج  بحـثبحـث  قائمة الاعضاءقائمة الاعضاء  المجموعاتالمجموعات  التسجيلالتسجيل  دخولدخول  

شاطر | 
 

 الدرس 03 – التصميم CSS

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل 
كاتب الموضوعرسالة
أبو نادر
Admin
Admin


♣ مشَارَڪاتْي » : 1944
♣ التسِجيلٌ » : 29/11/2012

مُساهمةموضوع: الدرس 03 – التصميم CSS   الأربعاء نوفمبر 30, 2016 9:01 pm


التصاميم

تم إزالة وسوم التعديل من صفحة HTML مثل (font) و تم استبدلها و حفظها في ملف تصميم منفصل .

كيف تستخدم التصميم

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

ملف تصميم خارجي
ملف تصميم داخلي
تصميم بنفس السطر

ملف التصميم الخارجي

يعتبر الملف الخارجي مثالي عند تطبيق تصميم معين للعديد من الصفحات . ومن خلال الملف الخارجي يمكنك التحكم بتصميم موقعك من خلال ملف واحد فقط ولكن كل صفحة HTML يجب أن تربطها بذلك الملف الخارجي وذلك باستخدام الوسم <link> داخل وسم <head> مع الحفاظ على نفس اللواحق الموجودة داخل الوسم <link> مثل rel=”stylesheet” type=”text/css” href=”mystyle.css” كما بالمثال التالي :

الرمز:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>


التصميم الداخلي

يمكن استخدام التصميم الداخلي عند استخدام تصميم فريد لصفحة ويب معينة عندها يمكننا استخدام تصميم داخلي أي في نفس صفحة الويب من خلال الوسم <style> واستخدام اللاحقة type=”text/css” أي نوع التصميم css ويستخدم داخل <head> أيضاً

الرمز:

<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>

تصميم داخل السطر

يسبب التصميم داخل السطر أي داخل وسم HTML فقدان خصائص التصميم المحترف وذلك بخلط وسوم HTML مع أكواد CSS لذلك استخدم هذه الطريقة باقتصاد وحكمة
لاستخدام طريقة التصميم داخل السطر استخدم اللاحقة style داخل الوسم الذي تود التعديل عليه كما يمكنك استخدام أي خاصية وقيمة تابعة css . يوضح المثال التالي أن هذه الفقرة بالتحديد سيطبق عليها تصميم اللون البني وتباعد يمين الصفحة بـ 20 بكسل

الرمز:

<p style="color:sienna; margin-right:20px">هذه فقرة لونها بني</p>

إن أردت تعلم الكثير عن ملفات التصميم يمكنك التوجه الى دورة CSS

وسوم التصميم

<style> تحدد معلومات التصميم للصفحة
<link /> تربط العلاقة بين صفحة الويب مع ملفات خارجية مختلفة
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو http://colamax.ahlamontada.com
 
الدرس 03 – التصميم CSS
استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
كولا ماكس ||سودانية الملامح .. عالمية الروئة ® :: اقسام تطوير المواقع والمنتديات :: قسم لغات البرمجة :: الدروس المتقدمة HTML-
انتقل الى: