معهد آفاق التيسير للتعليم عن بعد

معهد آفاق التيسير للتعليم عن بعد (http://afaqattaiseer.net/vb/index.php)
-   دورة أسس (html) (http://afaqattaiseer.net/vb/forumdisplay.php?f=652)
-   -   تسليم الواجبات التطبيقية (http://afaqattaiseer.net/vb/showthread.php?t=19335)

سامية السلفية 11 ذو القعدة 1433هـ/26-09-2012م 06:06 AM

تسليم الواجبات التطبيقية
 
بسم الله الرحمن الرحيم

الحمدلله والصلاة والسلام على رسول الله

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

تسليم الواجبات التطبيقية :

- ملف مرفق
أو
- باستخدام
كود بلغة HTML:

الكودهنا
أو
كود:

الكودهنا
وفقكم الله

لطيفة المنصوري 14 ذو القعدة 1433هـ/29-09-2012م 11:43 AM

التطبيق الأول
 
كود بلغة HTML:

<html>
<head>
<title>التطبيق الأول</title>
</head>
<body>
<p align="center">بسم الله الرحمن الرحيم</P>
<p align="right">
دورة أساياسيات<br>
((html))&nbsp;&nbsp;&nbsp;<br>
صفحة الطالبة سلفية</br>
<p align="center">
اللهم علمنا ما ينفعنا وانفعنا بما علمتنا<br>
وزدنا علما<br>
____________
</p>
</body>
</html>
 


سامية السلفية 14 ذو القعدة 1433هـ/29-09-2012م 05:07 PM

ما شاء الله . بارك الله فيك

إنشاء صفحة ويب باستخدام برنامج المفكرة Notpad (أحسنت)

تنسيق النص باستخدام <P> و<BR> و ; &nbsp (أحسنت)
استخدام خاصية align (أحسنت)

لإضافة خط أفقي:

الوسم <hr>


وهناك خصاص للتحكم بالطول والعرض واللون وغيرها ، نعرفها إن شاء الله في الدروس القادمة.

تركي 15 ذو القعدة 1433هـ/30-09-2012م 06:58 PM

كود بلغة HTML:

<html>
<head>
<title> تطبيق الدرس الأول </title>
<body>
<center>
بسم الله الرحمن الرحيم
<p>
معهد آفاق التيسير الإلكتروني
<br>
هو عبارة عن معهد للتعليم عن بعد &nbsp;يهتم بالعلم الشرعي عناية تامه
<br>
بإشراف الشيخ الفاضل عبدالعزيز الداخل
</center>
</body>
</head>
</html>


سلمى نصار 15 ذو القعدة 1433هـ/30-09-2012م 07:14 PM

1 مرفق
التطبيق الأول

تركي 15 ذو القعدة 1433هـ/30-09-2012م 08:34 PM

تطبيق الدرس الثاني
 
كود بلغة HTML:

<html dir=rtl>
<head>
<title> تطبيق الدرس الثاني </title>
<body background="C:\Users\USC-asus\Desktop\3.gif">
بسم الله الرحمن الرحيم
<br>
أستغفر الله الذي لا إله إلا هو الحي القيوم وأتوب إليه
</body>
</head>
</html >


سامية السلفية 16 ذو القعدة 1433هـ/1-10-2012م 09:03 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة تركي (المشاركة 98730)
كود بلغة HTML:

<html>
<head>
<title> تطبيق الدرس الأول </title>
<body>
<center>
بسم الله الرحمن الرحيم
<p>
معهد آفاق التيسير الإلكتروني
<br>
هو عبارة عن معهد للتعليم عن بعد &nbsp;يهتم بالعلم الشرعي عناية تامه
<br>
بإشراف الشيخ الفاضل عبدالعزيز الداخل
</center>
</body>
</head>
</html>


إنشاء صفحة ويب باستخدام برنامج المفكرة Notpad (أحسنت)
تنسيق النص باستخدام <P> و<BR> و ; &nbsp
(أحسنت)

بارك الله فيكم وجزاكم الله خيرا

سامية السلفية 16 ذو القعدة 1433هـ/1-10-2012م 09:37 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة جنان الفردوس (المشاركة 98735)
التطبيق الأول

إنشاء صفحة ويب باستخدام برنامج المفكرة Notpad (أحسنت)
تنسيق النص باستخدام <P> و<BR> و ; &nbsp
(أحسنت)
استخدام خاصية align (أحسنت)

بارك الله فيكم زنفع بكم وجعلنا الله وإياكم من الذين {هم على صلاتهم يحافظون}

سامية السلفية 16 ذو القعدة 1433هـ/1-10-2012م 09:50 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة تركي (المشاركة 98766)
كود بلغة HTML:

<html dir=rtl>
<head>
<title> تطبيق الدرس الثاني </title>
<body background="C:\Users\USC-asus\Desktop\3.gif">
بسم الله الرحمن الرحيم
<br>
أستغفر الله الذي لا إله إلا هو الحي القيوم وأتوب إليه
</body>
</head>
</html >


- استخدام <html dir=rtl> أو <html dir=ltr> (أحسنت)
- استخدام صورة كخلفية (أحسنت)


بارك الله فيكم ، اعتذر لم أنبه على هذا في الدرس:
عند استخدام صورة تكون على جهازك C:\Users\USC-asus\Desktop\3.gif

الكود صحيح والصورة تظهر دون مشاكل، لكن هذه الصورة لن تظهر للزائر أو المستخدم عند تحميل الصفحة ؛ لأنها غير موجودة على النت.

***الرابط الصحيح للصورة

(ملاحظة: تمت إضافة تنبيه بخصوص استخدام الصور من النت)

وفقكم الله

أمـنـيــــة 16 ذو القعدة 1433هـ/1-10-2012م 05:46 PM

التطبيق الاول
 
السلام عليكم و رحمة الله و بركاته
أولا: جزاكم الله خيرا على هذا الجهد
ثانيا: معذرة على تأخر التطيبق و ذلك بسبب عطل فى جهازى اسأل الله أن يحل على خير
ثالثا: قد واجهتنى بعد المشكلات و أود الاستفسار عنها
المشكلة الاولى: فى المتصفح جربت جوجل كروم و فايرفوكس و أوبرا و جميعها لا تدعم اللغة العربية عندى فتظهر الكتابة على شكل رموز
المشكلة الثانية: فى استخدام خاصية algin لا يظهر أى تغيير على الصفحة عند استخدامها فى أى وضع سواء يسار أو يمين أو وسط اما اذا استخدمت <center> فقط تعمل اما <left> <right> كلاهما تظهر الكتابة على اليسار لا اعرف هل المشكلة فى المتصفح أم الخطأ منى؟؟؟
معذرة على الاطالة
كود بلغة HTML:

<html>
<head>
<title> شعر </title>
</head>
<body>
<left>
 <center>
<p>
أمـَا والله لَو عَلِم الأنَام &nbsp;&nbsp;&nbsp; لِمَا خُلِقُوا لَمَا هَجَعُوا ونَامُوا<br>
لَقَد خُلِقُوا لأمْرٍ لَو رَأتْـه &nbsp;&nbsp;&nbsp; عُيُون قُلُوبِهم تَاهُوا وهَامُوا<br>
مَمَات ثُم قَـبْر ثُم حَشْر &nbsp;&nbsp;&nbsp;  وتَوْبِيخ وأهْـوَال عِظَـامُ<br>

</body>
</html>


سامية السلفية 16 ذو القعدة 1433هـ/1-10-2012م 07:20 PM

اقتباس:

المشاركة الأصلية كتبت بواسطة أمـنـيــــة (المشاركة 98865)
السلام عليكم و رحمة الله و بركاته
أولا: جزاكم الله خيرا على هذا الجهد
ثانيا: معذرة على تأخر التطيبق و ذلك بسبب عطل فى جهازى اسأل الله أن يحل على خير
ثالثا: قد واجهتنى بعد المشكلات و أود الاستفسار عنها
المشكلة الاولى: فى المتصفح جربت جوجل كروم و فايرفوكس و أوبرا و جميعها لا تدعم اللغة العربية عندى فتظهر الكتابة على شكل رموز
المشكلة الثانية: فى استخدام خاصية algin لا يظهر أى تغيير على الصفحة عند استخدامها فى أى وضع سواء يسار أو يمين أو وسط اما اذا استخدمت <center> فقط تعمل اما <left> <right> كلاهما تظهر الكتابة على اليسار لا اعرف هل المشكلة فى المتصفح أم الخطأ منى؟؟؟

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

وعليكم السلام ورحمة الله وبركاته
وخيرا جزاك

وفقك الله

أضيفي هذا السطر في قسم الرأس head
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
[إن شاء الله سوف نتعرف على محتويات هذا السطر في الدروس الأخيرة من الدورة]


وبالنسبة للغة العربية في المتصفحات:

1) فاير فوكس: من قائمة view
ثم character Encoding
وأخيرًا Arabic(windows-1256

2) جوجل كروم :
من قائمة أدوات Tools ثم تشفير Encodoing تختارين Arabic(windows-1256 أو UTF-8


المشكلة الثانية:

فى استخدام خاصية algin لا يظهر أى تغيير على الصفحة عند استخدامها فى أى وضع سواء يسار أو يمين أو وسط

- align وليس algin
خطأ إملائي في الدرس . أعتذر يا أختي

اما اذا استخدمت <center> فقط تعمل

اما <left> <right> كلاهما تظهر الكتابة على اليسار لا اعرف هل المشكلة فى المتصفح أم الخطأ منى؟؟؟

بارك الله فيك . ليس هناك وسوم <left> <right> المتصفح لا يتعرف عليها فلا ينفذ المطلوب
left وright خصائص تستخدم مع الوسوم مثال:

<p align=left>
<p align=right>
<br align=left>
<br align=right>

وفي الدروس التالية أيضا سترين كيف تستخدم هاتين الخاصيتين مع وسم الخط <font align=right> والصورة <img align=left> وغيرها
وأيضا كيفية تنسيق بيت شعري .

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

سلمى نصار 16 ذو القعدة 1433هـ/1-10-2012م 09:39 PM

التطبيق الثاني
 
1 مرفق
التطبيق الثاني ...

أمـنـيــــة 16 ذو القعدة 1433هـ/1-10-2012م 11:53 PM

تطبيق الدرس الثانى
 
السلام عليكم و رحمة الله و بركاته
جزاكم الله خيرا على حسن و سرعة الرد على الاستفسارات
تقبل الله منكم و جعل عملكم فى ميزان حسناتكم
كود بلغة HTML:

<html dir=rtl>
<head>
<title> شعر </title>
</head>
<body background=http://t1.gstatic.com/images?q=tbn:ANd9GcRw4mSkg83db2w85taTq7iDkTIm25bzfzi_XW2n-I_hhKr1UUZV>
<left>
 
<p>
أمـَا والله لَو عَلِم الأنَام &nbsp;&nbsp;&nbsp; لِمَا خُلِقُوا لَمَا هَجَعُوا ونَامُوا<br>
لَقَد خُلِقُوا لأمْرٍ لَو رَأتْـه &nbsp;&nbsp;&nbsp; عُيُون قُلُوبِهم تَاهُوا وهَامُوا<br>
مَمَات ثُم قَـبْر ثُم حَشْر &nbsp;&nbsp;&nbsp;  وتَوْبِيخ وأهْـوَال عِظَـامُ<br>

</body>
</html>


سامية السلفية 17 ذو القعدة 1433هـ/2-10-2012م 12:54 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة جنان الفردوس (المشاركة 98889)
التطبيق الثاني ...

بارك الله فيك
- استخدام <html dir=rtl> أو <html dir=ltr> (أحسنت)
- استخدام صورة كخلفية (أحسنت)


كود بلغة HTML:

<html dir=rtl >
<head>
<title> التطبيق الثاني- دورة أسس HTML</title>
 </head>
<body bgcolor="00ffff" background="http://www.aaa-backgrounds.com/azx248/marble4/6.gif" bgproperties="fixed">

<br> * الخاصية LEFTMARGIN : تحدد الهامش الأيسر لكل صفحة
<br> * الخاصية TOPMARGIN : تحدد الهامش العلوي لكل صفحة
</body>
</html>


سامية السلفية 17 ذو القعدة 1433هـ/2-10-2012م 01:02 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة أمـنـيــــة (المشاركة 98903)
السلام عليكم و رحمة الله و بركاته
جزاكم الله خيرا على حسن و سرعة الرد على الاستفسارات
تقبل الله منكم و جعل عملكم فى ميزان حسناتكم
كود بلغة HTML:

<html dir=rtl>
<head>
<title> شعر </title>
</head>
<body background=http://t1.gstatic.com/images?q=tbn:ANd9GcRw4mSkg83db2w85taTq7iDkTIm25bzfzi_XW2n-I_hhKr1UUZV>
<left>
 
<p>
أمـَا والله لَو عَلِم الأنَام &nbsp;&nbsp;&nbsp; لِمَا خُلِقُوا لَمَا هَجَعُوا ونَامُوا<br>
لَقَد خُلِقُوا لأمْرٍ لَو رَأتْـه &nbsp;&nbsp;&nbsp; عُيُون قُلُوبِهم تَاهُوا وهَامُوا<br>
مَمَات ثُم قَـبْر ثُم حَشْر &nbsp;&nbsp;&nbsp;  وتَوْبِيخ وأهْـوَال عِظَـامُ<br>

</body>
</html>


بارك الله فيك
- استخدام <html dir=rtl> أو <html dir=ltr> (أحسنت)
- استخدام صورة كخلفية (أحسنت)


تنبيه : <br align=left> أو <p align=left> وليس <left>

كود بلغة HTML:

<html dir=rtl>
<head>
 <title> شعر </title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
 </head>
 <body background=http://t1.gstatic.com/images?q=tbn:ANd9GcRw4mSkg83db2w85taTq7iDkTIm25bzfzi_XW2n-I_hhKr1UUZV>   
<p align=left>
 أمـَا والله لَو عَلِم الأنَام &nbsp;&nbsp;&nbsp; لِمَا خُلِقُوا لَمَا هَجَعُوا ونَامُوا<br>
 لَقَد خُلِقُوا لأمْرٍ لَو رَأتْـه &nbsp;&nbsp;&nbsp; عُيُون قُلُوبِهم تَاهُوا وهَامُوا<br>
 مَمَات ثُم قَـبْر ثُم حَشْر &nbsp;&nbsp;&nbsp;  وتَوْبِيخ وأهْـوَال عِظَـامُ<br>
</p>
</body>
</html>


وفقك الله وسددك

بنت عبد الرحمن 17 ذو القعدة 1433هـ/2-10-2012م 04:56 AM

html.indexغير مسموح برفع هذا النوع من الملفات
نوع الملف الذي اخترته : index

جزاكم الله خيرا وتقبله لكم عملا خالصا لوجهه الكريم
حاولت الرفع عدة مرات فجاءتني الرسالة اعلاه وبصراحة هذه اول مرة اطلع على مثل هذه الدروس
كما ان خاصية outil لم اجدها عندي وايضا وجدت خاصية view وغير مفعلة

سامية السلفية 17 ذو القعدة 1433هـ/2-10-2012م 06:21 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة بنت عبد الرحمن (المشاركة 98940)
html.indexغير مسموح برفع هذا النوع من الملفات
نوع الملف الذي اخترته : index

جزاكم الله خيرا وتقبله لكم عملا خالصا لوجهه الكريم
حاولت الرفع عدة مرات فجاءتني الرسالة اعلاه وبصراحة هذه اول مرة اطلع على مثل هذه الدروس
كما ان خاصية outil لم اجدها عندي وايضا وجدت خاصية view وغير مفعلة

وإياك آمين
بارك الله فيك
index.html وليس html.index
الكتابة ظهرت معكوسة عن نقل الدرس من وورد إلى المنتدى . وتم تصحيح ذلك في الدرس الأول والثاني

وفقك الله . قبل أن ترفعي الملف قومي بتحويله إلى index.html.txt أو index.txt

لأن الملفات بامتداد html لا يمكن رفعها



خاصية outil لم اجدها عندي وايضا وجدت خاصية view

بارك الله فيك . هذه الخصائص ليست من الدروس. ماذا تقصدين؟



لطيفة المنصوري 17 ذو القعدة 1433هـ/2-10-2012م 06:50 PM

التطبيق الثاني
 
كود بلغة HTML:

<html dir=rtl>
<head>
<title>التطبيق الثاني</title>
</head>
<body background="http://www.aaa-backgrounds.com/azx248/paper3/3.gif" bgcolor=#ffffcc>
سبحان الله وبحمده، سبحان الله العظيم
</body>
</html>


روان 17 ذو القعدة 1433هـ/2-10-2012م 08:17 PM

تطبيق الدرس الأول:

كود بلغة HTML:

<HTML>
  <HEAD>
 
  <TITLE>
التطبيق الأول، دورة تعلم أساسيات-  HTML
        </TITLE>
 
  </HEAD>
 
  <BODY>
 
<p align= "center">
  بسم الله الرحمن الرحيم<p>
 <p align= "center">
  صفحة  طالبة العلم &nbsp;روان &nbsp;لدورة تعلم أساسيات  HTML<p>
 <p align= "center">
  أبدأ مستعينة بالله<p>
 
</p>
 
  </BODY>
  </HTML>


سامية السلفية 18 ذو القعدة 1433هـ/3-10-2012م 07:02 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة سلفية (المشاركة 98959)
كود بلغة HTML:

<html dir=rtl>
<head>
<title>التطبيق الثاني</title>
</head>
<body background="http://www.aaa-backgrounds.com/azx248/paper3/3.gif" bgcolor=#ffffcc>
سبحان الله وبحمده، سبحان الله العظيم
</body>
</html>


بارك الله فيك
- استخدام <html dir=rtl> أو <html dir=ltr> (أحسنت)
- استخدام صورة كخلفية (أحسنت)

سامية السلفية 18 ذو القعدة 1433هـ/3-10-2012م 07:04 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة روان (المشاركة 98965)
تطبيق الدرس الأول:

كود بلغة HTML:

<HTML>
  <HEAD>
 
  <TITLE>
التطبيق الأول، دورة تعلم أساسيات-  HTML
        </TITLE>
 
  </HEAD>
 
  <BODY>
 
<p align= "center">
  بسم الله الرحمن الرحيم<p>
 <p align= "center">
  صفحة  طالبة العلم &nbsp;روان &nbsp;لدورة تعلم أساسيات  HTML<p>
 <p align= "center">
  أبدأ مستعينة بالله<p>
 
</p>
 
  </BODY>
  </HTML>


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

إنشاء صفحة ويب باستخدام برنامج المفكرة Notpad (أحسنت)
تنسيق النص باستخدام <P> و<BR> و ; &nbsp
(أحسنت)
استخدام خاصية align (أحسنت)

أمـنـيــــة 18 ذو القعدة 1433هـ/3-10-2012م 04:36 PM

التطبيق الثالث
 
كود بلغة HTML:

<html dir=rtl>
<head>
<title> شعر </title>
</head>
<body  style="background-image:url(http://t1.gstatic.com/images?q=tbn:ANd9GcRw4mSkg83db2w85taTq7iDkTIm25bzfzi_XW2n-I_hhKr1UUZV); background-color:white;    background-repeat:no-repeat; background-position: bottom">
<p>
أمـَا والله لَو عَلِم الأنَام &nbsp;&nbsp;&nbsp; لِمَا خُلِقُوا لَمَا هَجَعُوا ونَامُوا<br>
لَقَد خُلِقُوا لأمْرٍ لَو رَأتْـه &nbsp;&nbsp;&nbsp; عُيُون قُلُوبِهم تَاهُوا وهَامُوا<br>
مَمَات ثُم قَـبْر ثُم حَشْر &nbsp;&nbsp;&nbsp;  وتَوْبِيخ وأهْـوَال عِظَـامُ<br>

</body>
</html>


سامية السلفية 18 ذو القعدة 1433هـ/3-10-2012م 04:47 PM

اقتباس:

المشاركة الأصلية كتبت بواسطة أمـنـيــــة (المشاركة 99020)
كود بلغة HTML:

<html dir=rtl>
<head>
<title> شعر </title>
</head>
<body  style="background-image:url(http://t1.gstatic.com/images?q=tbn:ANd9GcRw4mSkg83db2w85taTq7iDkTIm25bzfzi_XW2n-I_hhKr1UUZV); background-color:white;    background-repeat:no-repeat; background-position: bottom">
<p>
أمـَا والله لَو عَلِم الأنَام &nbsp;&nbsp;&nbsp; لِمَا خُلِقُوا لَمَا هَجَعُوا ونَامُوا<br>
لَقَد خُلِقُوا لأمْرٍ لَو رَأتْـه &nbsp;&nbsp;&nbsp; عُيُون قُلُوبِهم تَاهُوا وهَامُوا<br>
مَمَات ثُم قَـبْر ثُم حَشْر &nbsp;&nbsp;&nbsp;  وتَوْبِيخ وأهْـوَال عِظَـامُ<br>

</body>
</html>


ما شاء الله . بارك الله فيك
- الخاصية background-image
(أحسنت)
- الخاصية background-repeat (أحسنت)

- الخاصية background-position (أحسنت)
- الخاصية background-color (أحسنت)

سلمى نصار 19 ذو القعدة 1433هـ/4-10-2012م 10:17 PM

التطبيق الثالث
 
1 مرفق
التطبيق الثالث

سامية السلفية 20 ذو القعدة 1433هـ/5-10-2012م 06:49 AM

(2) الدرس الثاني: تقنية css
 
اقتباس:

المشاركة الأصلية كتبت بواسطة جنان الفردوس (المشاركة 99105)
التطبيق الثالث

بارك الله فيك. وجزاك الله خيرا

- الخاصية background-image
(أحسنت)
- الخاصية Background-repeat (أحسنت)

- الخاصية background-position (أحسنت)
- الخاصية background-color (أحسنت)

وفقك الله يا جنان ، أرجو الانتباه لأمرين:

- وسم العنوان
كود بلغة HTML:

<title> التطبيق الثاني </title>
يكتب ضمن وسم الرأس
كود بلغة HTML:

<head>  </head>

- عند استخدام وسم الأنماط في إضافة خصائص لوسم المتن (صورة الخلفية، لون الخلفية...) body {...}
لا نستخدم نفس الخصائص ضمن وسم <body>

إما أن نستخدم وسوم HTML أو <style type="text/css"> الأنماط لكن ليس الطريقتين معا.

تصحيح:

كود بلغة HTML:

<html dir=rtl >

<head> دورة أسس HTML

<title> التطبيق الثاني </title>



<style type="text/css">

body {
      background-image:url(http://www.afaqattaiseer.com/vb/uploaded/2620_11346326552.jpg);
      background-repeat:repeat;
      background-position:center;
      background-color:#ff0000;
    }
 
</style>

</head>

<body text="#ff0000">

<br> * الخاصية LEFTMARGIN : تحدد الهامش الأيسر لكل صفحة
<br> * الخاصية TOPMARGIN : تحدد الهامش العلوي لكل صفحة

</body>

</html>



الساعة الآن 09:14 PM

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd. TranZ By Almuhajir