إذا كنت جديدًا في مجال تصميم الويب وتطوير الواجهة الأمامية (HTML ، CSS ، Javascript) ، فقد تختار البدء في WYSIWYG محرر. يشير هذا الاختصار إلى "ما تراه هو ما تحصل عليه" ويشير أساسًا إلى البرنامج الذي يسمح لك بذلك قم بإنشاء صفحة ويب باستخدام الأدوات المرئية بينما يكتب البرنامج بعض التعليمات البرمجية خلف الكواليس بناءً على ما أنت عليه خلق. يمكن القول إن أداة WYSIWYG الأكثر شيوعًا المتاحة هي برنامج Adobe Dreamweaver.
خيار جيد لأولئك الذين بدأوا للتو
في حين أن العديد من محترفي الويب المخضرمين لديهم المزيد مهارات مصقولة انظر إلى Dreamweaver وميله إلى إنتاج ترميز HTML متضخم و أنماط CSS، الحقيقة البسيطة هي أن النظام الأساسي يظل خيارًا جيدًا لأولئك الذين بدأوا للتو في تصميم مواقع الويب. عندما تبدأ في استخدام خيار "عرض التصميم" الخاص بـ Dreamweaver لإنشاء صفحة ويب ، فمن المحتمل أن يكون أحد الأسئلة التي قد تطرحها هو كيفية إنشاء فاصل سطر واحد للمحتوى في طريقة العرض هذه.
عندما تضيف نص HTML إلى صفحة ويب ، سيعرض متصفح الويب هذا النص كسطر طويل حتى يصل إلى حافة نافذة المتصفح أو عنصر الحاوية الخاص به. عند هذه النقطة ، سوف يلتف النص إلى السطر التالي. هذا مشابه لما يحدث في أي برنامج لمعالجة النصوص ، مثل Microsoft Word أو Google Docs. عندما لا توجد مساحة إضافية لسطر النص على السطر الأفقي ، فإنه يلتف ليبدأ سطرًا آخر. إذن ماذا يحدث إذا كنت تريد أن تملي أين ينقطع السطر؟
عندما تضغط على ENTER في طريقة العرض Design View الخاصة بـ Dreamweaver
عندما تضغط أدخل في عرض تصميم Dreamweaver ، يتم إغلاق الفقرة الحالية وتبدأ فقرة جديدة. بصريًا ، سيعني هذا أن هذين السطرين مفصولان ببعض التباعد الرأسي. هذا بسبب HTML افتراضيًا تحتوي الفقرات على حشو أو هوامش (أي واحد يعتمد على المتصفح نفسه) يتم تطبيقه على الجزء السفلي من الفقرة التي تضيف هذا التباعد.
يمكن تعديل ذلك باستخدام CSS ، ولكن الحقيقة هي أنك تريد أن يكون هناك مسافات بين الفقرات للسماح بقراءة موقع الويب. إذا كنت تريد سطرًا واحدًا ولا تريد تباعدًا رأسيًا واسعًا بين السطور ، فأنت لا تريد استخدام المفتاح ENTER لأنك لا تريد أن تكون هذه الأسطر فقرات فردية.
عندما لا تريد فقرة جديدة أن تبدأ
لهذه الأوقات التي لا تريد فيها أن تبدأ فقرة جديدة ، يمكنك إضافة امتداد
علامة في HTML. هذا أيضا مكتوب في بعض الأحيان باسم
. خصيصًا لإصدارات XHTML التي تتطلب إغلاق جميع العناصر. يؤدي التذييل / في بناء الجملة إلى إغلاق العنصر ذاتيًا منذ امتداد
لا تحتوي العلامة على علامة إغلاق خاصة بها. كل هذا جيد وجيد ، لكنك تعمل في Design View في Dreamweaver. قد لا ترغب في القفز إلى الكود وإضافة هذه الفواصل. هذا جيد ، لأنه يمكنك بالفعل إضافة فاصل أسطر في Dreamweaver دون اللجوء إلى عرض التعليمات البرمجية.
أضف فاصل أسطر في طريقة عرض تصميم Dreamweaver:
- ضع المؤشر حيث تريد أن يبدأ الخط الجديد.
- اضغط باستمرار على مفتاح التحول و اضغط يدخل.
هذا هو! ستضيف الإضافة البسيطة لمفتاح "shift" مع مفتاح [ENTER]
بدلا من فقرة جديدة. والآن بعد أن عرفت كيف يتم ذلك ، يجب أن تفكر في مكان استخدامه وأين تتجنبه. تذكر، لغة البرمجة يهدف إلى إنشاء بنية الموقع ، وليس المظهر المرئي. يجب ألا تستخدم ملفات متعددة
العلامات لإنشاء مسافات رأسية أسفل العناصر في تصميمك.
هذا هو الغرض من خصائص CSS الخاصة بالحشو والهوامش. أين ستستخدم ملف
العلامة عندما تحتاج فقط إلى فاصل سطر واحد. على سبيل المثال ، إذا كنت تقوم بترميز عنوان بريدي وقررت استخدام فقرة ، فيمكنك إضافة
علامات مثل هذا:
اسم الشركة
خط عنوان
رمز ولاية المدينة.
هذا الرمز الخاص بالعنوان عبارة عن فقرة واحدة ، لكنه سيعرض بشكل مرئي الأسطر الثلاثة على أسطر فردية مع وجود مسافة صغيرة بينها.