Accéder au contenu principal

Articles

Affichage des articles du avril, 2014

الدرس 5 css

 النصوص تنسيق وإضافة طراز إلى النصوص هي مسئلة أساسية لمصممي المواقع، في هذا الدرس ستأخذ مقدمة حول الأساليب العجيبة التي تقدمها CSS لتنسيق النص، سنتحدث عن هذه الخصائص في هذا الدرس: text-indent text-align text-decoration letter-spacing text-transform وضع فارغ قبل أول سطر "text-indent" الخاصية  text-indent  تسمح لك بإضافة لمسة أنيقة إلى الفقرات بوضع مسافة فارغة قبل أول سطر من الفقرة، في المثال أدناه وضعنا القيمة  30px  لكل الفقرات التي تستخدم العنصر  <p> : p { text-indent: 30px; } شاهد المثال محاذاة النص "text-align" خاصية  text-align  تشبه في HTML خاصية "align" التي كانت تستخدم في الماضي، النص يمكن محاذاته نحو اليسار " left " أو اليمين " right " أو في المنتصف " centred " وبالإضافة إلى ذلك القيمة  justify ستقوم بمحاذاة النص من الجانبين كما تفعل بعض الصحف والمجلات. في المثال أدناه النص في رأس الجدول  <th>  قمنا بمحاذاته نحو اليمين، بينما البيانات في الجدول  <td>  حاذيناها نحو المنتصف أما النص في الفقرا...

الدرس 7 html

 الخصائص هناك خصائص يمكنك أن تستخدمها لمعظم العناصر ما هي الخاصية؟ أنت تتذكر أن العناصر تعطي هيكلية لصفحة HTML وتخبر المتصفح كيف تريد لموقعك أن يظهر، كمثال  <br />  تخبر المتصفح أن يقوم بنقل ما بعدها من نص إلى سطر جديد، في بعض العناصر يمكنك أن تضيف المزيد من المعلومات، هذه المعلومات تسمى خصائص. مثال 1: <h2 style="background-color:#ff0000;">My friendship with HTML</h2> الخصائص تكتب دائماً بنفس الطريقة، فهي تبدأ باسم الخاصية ثم يتبعها علامة يساوي "=" ثم قيمة الخاصية، الفاصلة المنقوطة في المثال تستخدم فقط في خاصية "style" ووظيفتها الفصل بين أوامر مختلفة، سنتحدث عن ذلك في وقت لاحق. هناك خصائص كثيرة ومختلفة، سنتعلم أولاً واحدة منها وهي style،  والتي يمكن استخدامها لإضافة تصميم لموقعك . فمثلاً يمكن إضافة لون خلفي للصفحة: مثال 2: <html> <head> </head> <body style="background-color:#ff0000;"> </body> </html> هذه الخاصية ستجعل لون الصفحة أحمرا، انظر بنفسك، سنشرح أكثر عن الألوان ...

بطاقة master card فيها 25 دولار مجانا

احصل على بطاقة master card فيها 25 دولار مجانا من payoneer http://adf.ly/lOOof

الدرس 6 html

هل قمت بإنشا المزيد من الصفحات بنفسك؟ إن لم تفعل فإليك هذا المثال: <html> <head> <title>My website</title> </head> <body> <h1>A Heading</h1> <p>text, text text, text</p> <h2>Subhead</h2> <p>text, text text, text</p> </body> </html> ما التالي؟ حان الوقت الآن لتعلم سبعة عناصر جديدة. بنفس الطريقة التي تؤكد فيها على نص معين عندما تضعه بين وسم البداية  <em>  ووسم الإغلاق  </em> , يمكنك أن تضيف تأكيداً أقوى باستخدام وسم البداية  <strong>  ووسم الإغلاق  </strong> . مثال 1: <strong>This should be stronger emphasis.</strong> سيظهر بهذا الشكل في المتصفح: This should be stronger emphasis. بطريقة مماثلة يمكنك تصغير النص باستخدام العنصر  small : مثال 2: <small>This should be in small.</small> سيظهر بهذا الشكل في متصفحك This should be in small. هل أستطيع استخدام عدة عناصر في نفس الو...

الدرس 5 html

إبدأ دائماً بالقالب الذي قمنا بإنشاءه في الدرس السابق: <html> <head> <title></title> </head> <body> </body> </html> في قسم رأس الصفحة اكتب دائماً العنوان:  <title> عنوان صفحتك </title> . لاحظ كيف سيظهر العنوان في أعلى يسار نافذة المتصفح: العنوان بشكل خاص مهم لأنه يستخدم في محركات البحث - مثل غوغل - لأرشفة موقعك وإظهاره في نتائج البحث. في جسم الصفحة اكتب محتويات صفحتك، وأنت تعرف الآن بعض أهم العناصر: <p>Is used for paragraphs.</p> <em>Emphasis text.</b> <h1>Heading</h1> <h2>Subhead</h2> <h3>Sub-subhead</h3> تذكر أن الطريقة الوحيد لتعلم HTML هي بالتجربة والخطأ، لكن لا تقلق، لا يمكنك بأي طريقة أن تدمر حاسوبك أو الإنترنت! لذلك استمر في التجربة، هذه هي أفضل طريقة لاكتساب الخبرة. ماذا يعني هذا؟ لا أحد يتقن تطوير المواقع بتعلم الأمثلة فقط في هذا الدرس، فهذا الدرس هو مجرد بداية بسيطة لفهم مكونات المواقع، ولكي تقوم بإنشاء موقع جيد عليك أن تستخدم...

الدرس 4 html

إنشاء موقعك الأول أصبحت الآن على بعد دقائق من إنشاء أول موقع لك. كيف؟ في الدرس الأول ألقينا نظرة على الأدوات التي نحتاجها لإنشاء موقع: متصفح وبرنامج المفكرة أو أي محرر نصي مماثل، وبما أنك تقرأ هذه الصفحة فأنت تستخدم الآن متصفحاً، ما تحتاجه الآن هو أن تفتح نافذة جديدة من المتصفح لكي تستطيع قراءة هذا الدرس بينما تستخدم النافذة الأخرى لترى فيها موقعك. أيضاً عليك أن تفتح برنامج المفكرة "Notepad" والذي ستجده في قائمة إبدأ ثم برامج ثم أدوات: أنت جاهز الآن! ماذا أفعل؟ لنبدأ بشيء بسيط، سنقوم بإنشاء صفحة تقول "مرحى! هذا هو موقعي الأول." أكمل القراءة وستعرف كم هو بسيط فعل ذلك. لغة HTML بسيطة ومنطقية،  المتصفح يقرأ HTML كما تقرأ أنت اللغة الإنجليزية: من الأعلى إلى الأسفل ومن اليسار إلى اليمين ، لذلك صفحة HTML بسيطة تبدأ بما يجب أن تبدأ به أي صفحة HTML وتنتهي بما يجب أن يأتي في نهاية الصفحة. أول شيء عليك فعله هو أن تخبر المتصفح بأنك "ستتحدث" معه بلغة HTML، يمكنك فعل ذلك عن طريق وسم  <html>  لا توجد أي مفاجئة هنا، لذلك قبل أن تبدأ أي شيء أكتب " <html> ...

الدرس 3 html

العناصر والوسوم العناصر تعطي لوثائق HTML هيكلية محددة وتخبر المتصفح عن كيفية عرض الصفحة، بشكل عام العناصر عبارة عن وسم "tag" للبداية ثم بعض المحتويات ثم وسم الإغلاق. "وسوم"؟ الوسوم هي توصيفات تستخدمها لكي تضعها في بداية العنصر وعند نهايته. كل الوسوم لها نفس نفس الشكل، تبدأ مع علامة أصغر من  "<"  وتنتهي مع علامة أكبر من  ">" . بشكل عام هناك نوعان من الوسوم، وسم البداية:  <html>  ثم وسم الإغلاق  </html> . الفرق بين الإثنين هي علامة "/"، توصيف المحتويات يكون بوضعها بين وسم البداية ووسم الإغلاق. لغة HTML تتكون من هذه العناصر، لكي تتعلم HTML عليك أن تتعلم وتستخدم وسوماً مختلفة. هل يمكنك أن تريني بعض الأمثلة؟ حسناً، العنصر  em  يشدد النص "يجعله مائلاً" وكل النصوص بين وسم البداية  <em>  ووسم الإغلاق  </em>  ستظهر بشكل مائل في المتصفح. ("em" هي اختصار "emphasis".) المثال 1: <em>نص مائل.</em> سيظهر بهذا الشكل في المتصفح: نص مائل. العناصر  h1 ،  h2 ،  h3 ،  h4 ،  h5 ...

الدرس 4 css

في هذا الدرس ستتعلم الخطوط وكيف تفعلها باستخدام CSS، وسنقوم أيصاً بمعالجة مشكلة كيفية عرض بعض الخطوط التي لن تظهر بشكل صحيح ما لم تكن مثبتة على الحاسوب، سنتعلم هذه الخصائص في هذا الدرس: نوع الخطوط "font-family" الخاصية  font-family  تستخدم لوضع قائمة خطوط تطبق على حسب الأولوية على عنصر أو صفحة ما، إذا لم يجد المتصفح الخط الأول ضمن قائمة الخطوط سيقوم باستخدام الخط الثاني في القائمة وإذا لم يجده سيحاول عرض الخط التالي، وهكذا حتى يجد الخط المناسب. هناك نوعان من أسماء الخطوط تستخدم لتصنيفها، خطوط بأسماء محددة أو أسماء عامة، المصطلحين سنشرحهما في الفقرات اللاحقة. أسماء الخطوط أمثلة لخطوط بأسماء محددة هي "Arial" و"Times New Roman" أو "Tahoma". أسماء عامة الأسماء العامة للخطوط تحدد المجموعة من الخطوط التي لها شكل متماث، فمثلاً sans-serif هي مجموعة من الخطوط لا تحوي زوائد على الأحرف وهي خطوط مناسبة لعرض النص على الشاشة. الاختلاف بين أنواع الخطوط يوضح في المثال التالي: عندما تضع قائمة بالخطوط في موقعك فأنت تبدأ مع الخط المفضل لديك ثم الذي يليه، ومن الأفضل...

الدرس css 3

سنتعلم كيفية تفعيل الألوان والخلفيات لموقعك، سنقوم أيضاً بتعلم طرق متقدمة لتحديد موقع صورة الخلفية، نشرح هذه الخصائص في  CSS الرئيسية » دروس » CSS » درس 3: الألوان والخلفيات الدرس 3: الألوان والخلفيات في هذا الدرس سنتعلم كيفية تفعيل الألوان والخلفيات لموقعك، سنقوم أيضاً بتعلم طرق متقدمة لتحديد موقع صورة الخلفية، نشرح هذه الخصائص فيcss  لون المقدمة: خاصية 'color' خاصية color تصف لون عنصر HTML. فمثلاً تصور أنك تريد أن تكون كل العناوين في الصفحة ملونة بلون أحمر داكن، كل العناوين رمزت باستخدام وسم <h1> ، المثال أدناه سيقوم بتوضيح كيفية تحويل كل <h1> إلى اللون الأحمر: h1 { color: #ff0000; } الألوان يمكن أن تحدد باستخدام نظام الأرقام الست عشري كما في المثال أعلاه، أو بأن تختار اسم اللون "red"، أو من خلال قيمة RGB والتي تعني Red وGreen وBlue، مثال: (rgb(255,0,0)) . خاصية 'background-color خاصية background-color تحدد لون خلفية أي عنصر. العنصر <body> يضم كل محتويات وثيقة HTML، لذلك لتغيير خلفية الصفحة بأكملها يجب أن...

الربح من الانترنت

الربح من الانترنت ادخل الى الررابط اسفل   اضغط هنا

نوكيا الشاحن اللاسلكي Fatboy

من هو أول هاتف محمول مزود بتقنية الشاحن اللاسلكي لنظام الويندوز فون ؟ أنه اللوميا 920 لذالك الهاتف يدعم تقنية الشاحن اللاسلكي Qi ممايعني أنه متوافق مع أي شاحن لاسلكي من الطرف الثالث لكن نوكيا كشفت عن شاحن لاسلكي أبو وساده Fatboy

الدرس html 2

ما هي HTML HTML هي اللغة الأم لمتصفحك. لكي نختصر القصة، HTML اخترعت في عام 1990م من قبل عالم يسمى تيم بيرنرز لي، الهدف من هذه اللغة هو تبسيط عملية وصول العلماء في جامعات مختلفة إلى البحوث التي ينشرونها، المشروع نجح بشكل لم يتصوره تيم بيرنرز لي، باختراعه HTML قام تيم بوضع أساس شبكة الويب كما نعرفها اليوم. HTML هي لغة تسمح بعرض المعلومات (مثال: البحوث العلمية) على شبكة إنترنت، ما تراه عند زيارتك لأي صفحة في الشبكة هو ترجمة المتصفح لأوامر HTML، لكي ترى HTML لأي صفحة تزورها عليك أن تضغط على قائمة عرض "View" ثم المصدر "Source". لمن لم يعتد على رؤية هذه الأوامر، HTML تبدو معقدة لكن هذا الدرس سيساعدك على أن تفهمها. ما فائدة HTML؟ إذا أردت إنشاء موقع فلا توجد طريقة أخرى غير استخدام لغة HTML، حتى لو استخدمت برنامجاً لإنشاء المواقع مثل دريمويفر، معرفتك للغة HTML ولو بشكل بسيط ستساعدك على إنشاء مواقع أفضل، الجميل أن هذه اللغة سهلة التعلم، في درسين فقط ستتعلم كيفية إنشاء موقعك الأول. HTML تستخدم لإنشاء المواقع، هذا كل شيء ببساطة! حسناً، ماذا تعني H-T-M-L؟ HTML هي اختصا...

درس css 2

كيف تعمل تقنية CSS؟ في هذا الدرس ستتعلم كيف تقوم بإنشاء ملف التصميم الأول، ستتعلم أساسيات CSS وما هي الوسوم اللازمة لتستخدم CSS في وثيقة HTML. الكثير من خصائص CSS تشبه تلك المستخدمة في HTML، لذلك إذا تعلمت HTML واستخدامتها لإنشاء التصاميم فأنت في الغالب ستتمكن من تعلم CSS بسهولة، لنلقي نظرة على هذا المثال الأساسي. القواعد الأساسية لكتابة CSS لنقل أننا نريد اللون الأحمر ليكون خلفية للصفحة: باستخدام HTML يمكننا أن ننجز ذلك بهذه الطريقة: <body bgcolor="#FF0000"> مع CSS يمكن تحقيق نفس النتيجة بكتابة هذه الأوامر: body {background-color: #FF0000;} كما تلاحظ، أوامر CSS تتشابه كثيراً مع HTML، والمثال أعلاه يوضح لك الأسلوب الأساسي لكتابة CSS: لكن أين نضع أوامر CSS؟ هذا هو ما سنتعلمه الآن. تفعيل CSS في صفحة HTML هناك ثلاث طرق يمكن أن تستخدمها لتفعيل CSS في صفحة HTML، هذه الطرق مشروحة أدناه، ونحن ننصح بأن تركز وتستخدم الطريقة الثالثة، وهي أن تضع CSS في ملف منفصل. الطريقة 1: ضمن وسوم HTML باستخدام خاصية style إحدى الطرق لتفعيل CSS في HTML هي باستخدام خاصية style ، لنأ...

درس css 1

CSS هي اختصار لي C ascading S tyle S heets. CSS هي لغة تصميم تحدد شكل وثيقة HTML، فهي تهتم بالخطوط، الألوان، الهامش، والعرض والارتفاع، صورة خلفية الموقع، وكيفية توزيع المساحات وأشياء أخرى كثيرة، انتظر فقط وسترى! HTML يمكن أن تستخدم بشكل خاطئ لإضافة تصميم للمواقع، لكن CSS توفر المزيد من الخيارات وهي أكثر دقة وعملية، وهي مدعومة من قبل المتصفحات الرئيسية اليوم. بعد أجزاء قليلة في هذا الدرس ستتمكن من إنشاء ملف CSS الأول لكي تعطي موقعك مظهراً رائعاً ما الفرق بين CSS وHTML؟ تستخدم لوضع هيكلية ونظام منطقي للمحتويات، أما CSS فهي تستخدم لإضافة تصميم لهذه المحتويات. حسناً، قد يبدو هذا مربكاً لكن أكمل القراءة وستفهم ما قرأته قريباً. في الماضي القريب اخترع رجل اسمه تيم بيرنرز لي شبكة الويب، في ذلك الوقت كانت HTML تستخدم فقط لإضافة هيكلية للنص، الكاتب يمكنه أن يقوم بإضافة معنى للنص بأن يقول مثلاً "هذا عنوان" أو "هذه فقرة" ويستخدم وسوم HTML مثل <h1> و <p> . مع ازدياد شهرة شبكة الويب بدأ المصممون في البحث عن طرق لإضافة تصميم للوثائق، ولتلبية رغباتهم قام مبرمجو...

الدرس 1 html

مقدمة سهلة وصحيحة وشاملة إلى كيفية إنشاء المواقع  من نقطة الصفر ولا يتطلب أي معرفة مسبقة منك عن البرمجة أو تطوير المواقع ما الذي تحتاجه لديك "متصفح"، وهو البرنامج الذي يمكنك من تصفح المواقع والتجول فيها، الآن أنت تنظر إلى هذه الصفحة من خلال متصفحك. ستحتاج إلى محرر نصي بسيط، إذا كنت تستخدم نظام ويندوز يمكنك أن تستخدم المفكرة "Notepad" والذي يمكنك أن تجده في قائمة إبدأ "start" ثم قائمة البرامج "Program" ثم في قائمة الأدوات "Accessories" لا تحتاج إلى اتصال بالشبكة