إعلان
دورة تطوير التطبيقات باستخدام لغة JavaScript في هذه الدورة ستتعلم لغة جافا سكريبت, استخدام مكتبة React.js, بناء API الموقع بواسطة Node.js, تطوير تطبيق جوال باستخدام React Native, و في نهاية الدورة ستتعلم تطوير تطبيق محادثة شبيه بتطبيق WhatsApp. تعلم الآن
دورة تطوير واجهات المستخدم في هذه الدورة ستتعلم لغة HTML و لغة CSS و لغة JavaScript. من ناحية التطبيق العملي ستتعلم طريقة بناء واجهة متجر إلكتروني مكون من ست صفحات, تحويل خمسة تصاميم PSD إلى صفحات ويب, بناء واجهة مستخدم تشبه موقع يوتيوب, بناء لوحة تحكم إحترافية. تعلم الآن
تطوير تطبيقات باستخدام لغة بايثون في هذه الدورة ستتعلم أساسيات البرمجة بلغة بايثون وصولاً إلى التعامل مع أشهر أطر العمل (Flask و Django) و ستتعلم كيف تبني متجر إلكتروني يمكن للمستخدمين البيع و الشراء من خلاله. تعلم الآن
دورة تطوير تطبيقات الويب باستخدام لغة PHP في هذه الدورة ستتعلم لغة PHP من الصفر, استخدام إطار العمل Laravel بشرح مفصّل و عملي, كيفية تطوير شبكة اجتماعية تشبه Instagram, بناء API لتطبيق جوال وفق أسلوب RESTful, تطوير موقع إعلانات مبوبة, تطوير نظام إدارة محتوى CMS كامل. تعلم الآن
دورة تطوير تطبيقات الويب باستخدام لغة Ruby في هذه الدورة ستتعلم البرمجة بلغة Ruby إنطلاقاً من أبسط المفاهيم وحتى بناء تطبيق حقيقي, إستخدام إطار العمل Ruby on Rails بشرح مفصّل و عملي, بناء تطبيق حقيقي عبارة عن شبكة اجتماعية تشبه تويتر, تطوير مجتمع الكتروني يشبه حسوب I/O. تعلم الآن
دورة علوم الحاسوب هذه الدورة معدة لتكون مدخل لعلوم الحاسوب و لغات البرمجة حيث ستتعرف فيها على أنظمة التشغيل و ستتعمق في نظام لينكس و في كيفية التعامل معه من خلال موجه الأوامر, بالإضافة إلى قواعد البيانات و أساسيات الشبكات و الخوادم و مبادئ الحماية والأمان في الويب. تعلم الآن

    HTML تحديد إتجاه المحتوى

    مشاكل عرض محتوى باللغة العريبة

    إفتراضياً يتوقع المتصفح أنك تريد الكتابة من الجهة اليسرى إلى الجهة اليمنى كما هو الحال في الصفحات الأجنبية التي يكون محتواها باللغة الإنجليزية, لذلك حتى لو قمت بعرض فقرة مكتوبة باللغة العربية ستجد أن المتصفح يعرضها من الجهة اليسرى و بشكل غير جميل.

    هناك مشكلة أخرى تربك المتعاملين مع اللغة العربية بشكل كبير سواء عند كتابة الكود في المحرر أو حتى في الصفحة و هي ظهور التنقيط (كالنقطة العادية, علامات الإستفهام, التعجب إلخ..) الذي وضعوه في نهاية النص قبل بداية النص كما في الصورة التالية.

    من لا يملك أي خبرة في HTML تجده يتلاعب بمكان التنقيط إلى أن يظهر في آخر النص ظناً منه أنه لا يوجد حلول أخرى و لكن هذا الأمر خاطئ أيضاً.
    سبب هذه المشكلة بالتحديد هو أن المتصفح يعتبر أنك تكتب نص أجنبي و تنهيه بتنقيط, و التنقيط في الجمل الأجنبية يتم وضعه في آخر النص من الناحية اليسرى و ليس اليمنى.


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

    المثال الأول

    <!DOCTYPE html>
    <html>
        <body>
            <p>مرحباً بك في موقع هرمش.</p>
        </body>
    </html>
    		

    جرب الكود



    في المثال التالي قمنا بعرض قائمة النصوص الموضوعة فيها باللغة العربية حتى ترى أيضاً كيف أنه سيظهر لك المزيد من المشاكل كلما استخدمت المزيد من الوسوم.
    هنا يوجد مشكلة أساسية و هو أن القائمة ستظهر رمز كل عنصر موضوع فيها من الناحية اليسرى و نصوص العناصر سيتم عرضه من الناحية اليسرى أيضاً.

    المثال الثاني

    <!DOCTYPE html>
    <html>
        <body>
            <ul>
    			<li>محمد هرموش</li>
    			<li>أحمد الكردي</li>
    			<li>أيمن مصطفى</li>
            </ul>
        </body>
    </html>
    		

    جرب الكود

    تحديد إتجاه محتوى الصفحة

    إفتراضياً, إتجاه الكتابة في الصفحة هو من اليسار إلى اليمين كما هو الحال حين نكتب باللغة الإنجليزية أو الفرنسية.

    لتحديد جهة الكتابة في كامل الصفحة يجب إضافة الخاصية dir لوسم الصفحة الأساسي <html> مع تمرير إحدى القيمة التالية لها:

    • ltr لإظهار محتوى الصفحة من اليسار إلى اليمين و هذه هي القيمة الإفتراضية.
    • rtl لإظهار محتوى الصفحة من اليمين إلى اليسار و هذا الأمر تحتاجه في حال كان محتوى الصفحة بالعربية.
    • auto لإظهار محتوى الصفحة بشكل تلقائي من الجهة المناسبة للمحتوى الصفحة مع الإشارة إلى أنه يفضل عدم اعتماد هذا الخيار.


    معلومة تقنية

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



    في المثال التالي قمنا بعرض نموذج تسجيل دخول عربي.

    المثال الأول

    <!DOCTYPE html>
    <html dir="rtl">
        <body>
            <h2>تسجل الدخول</h2>
            <form>
                <label for="username">إسم المستخدم</label>
                <input type="text" id="username" name="username">
                <br><br>
                <label for="password">كلمة المرور</label>
                <input type="password" id="password" name="password">
                <br><br>
                <input type="submit" value="دخول">
            </form>
        </body>
    </html>
    		

    جرب الكود



    في المثال التالي قمنا بعرض صفحة أغلب محتواها عربي و تتضمن أيضاً محتوى إنجليزي.

    المثال الثاني

    <!DOCTYPE html>
    <html dir="rtl">
        <body>
            <h2>دورة تعلم الإنجليزية للمبتدئين</h2>
            <p>فيما يلي قمنا بذكر بعض الجمل التي نستخدمها في الحياة اليومية:</p>
    		<br>
            <p dir="ltr">Good morning, how are you today?</p>
            <p>صباح الخير, كيف حالك اليوم؟</p>
    		<br>
            <p dir="ltr">I am sorry for late.</p>
            <p>أعتذر على التأخير.</p>
        </body>
    </html>
    		

    جرب الكود

    إعلان

    Eqla3Tech.com

    شروحات مكتوبة حول لغات البرمجة و تقنية المعلومات باللغة العربية مقدمة من إقلاع تك.

    لغة جافا لغة ++C قواعد البيانات نظام ويندوز نظام لينكس الشبكات تقنية المعلومات الأمن السيبراني

    الدورات

    أدوات مساعدة

    الأقسام

    دورات
    مقالات أسئلة مشاريع كتب