اسحب من المسطرة المطابقة.
تاريخ آخر تحديث
27 أبريل 2021
استخدم الوسائل المساعدة المرئية للتخطيط في Dreamweaver، بما في ذلك مسطرات الضبط وأدلة تخطيط الضبط، واستخدام الأدلة مع القوالب واستخدام شبكة تخطيطات، واستخدام صورة متابعة.
تعيين المساطر
تساعدك المساطر في قياس وتنظيم وتخطيط تخطيطك. يمكن أن تظهر على الحدود اليسرى والعلوية للصفحة، مُقسمة بوحدات البكسل أو البوصات أو السنتيمترات.
- لتبديل تشغيل المساطر وإيقافها، حدد View > Design View Options > Rules > Show/Hide.
- لتغيير الأصل، اسحب أيقونة أصل المسطرة
(في الركن العلوي الأيسر من طريقة العرض Design بالنافذة Document) في أي مكان من الصفحة. - لإعادة تعيين الأصل إلى موقعه الافتراضي، حدد View > Design View Options >Rulers > Reset Origin.
- لتغيير وحدة القياس، حدد View > Rulers، ثم حدد Pixels أو Inches أو Centimeters.
قم بتعيين أدلة التخطيط
الأدلة هي خطوط تسحبها إلى المستند من المساطر. تساعدك في وضع ومحاذاة الكائنات بدقة أكبر. يمكنك أيضًا استخدام Guides لقياس حجم عناصر الصفحة، أو محاكاة الطيات (المناطق المرئية) في متصفحات الويب.
لمساعدتك في محاذاة العناصر، يمكنك جذب العناصر إلى الأدلة، وجذب الأدلة إلى العناصر. (يجب أن تكون العناصر موضوعة بشكل مطلق لكي تعمل ميزة المحاذاة.)يمكنك أيضًا قفل Guides لمنع تحريكها عن طريق الخطأ بواسطة مستخدم آخر.
إنشاء دليل أفقي أو عمودي
ضع الدليل في نافذة المستند واترك
زر الماوس (أعد وضع الدليل بسحبه مرة أخرى).
ملاحظة
افتراضيًا، يتم تسجيل Guides كقياسات بكسل مطلقة من الجانب العلوي أو الأيسر للمستند، وتُعرض بالنسبة إلى نقطة أصل المسطرة.لتسجيل الدليل كنسبة مئوية، اضغط مفتاح Shift أثناء إنشاء أو تحريك الدليل.
إظهار أو إخفاء الأدلة
اختر View > Guides >
Show Guides.
محاذاة العناصر إلى الأدلة
- لمحاذاة الأدلة إلى العناصر، حدد View > Design View Options > Guides > Snap to Guides.
- لمحاذاة الأدلة إلى العناصر، حدد View > Design View Options > Guides > Guides Snap to Elements.
ملاحظة
عند تغيير حجم العناصر، مثل العناصر ذات التعيين المطلق للموضع (عناصر AP) والجداول والصور يتم محاذاة العناصر التي تم تغيير حجمها إلى الأدلة.
تأمين أو قفل كل الأدلة
حدد View > Design View Options > Guides > Lock Guides.
عرض وتحريك دليل إلى موضع محدد
مرر مؤشر الماوس فوق الدليل
لعرض موضعه.
انقر نقرًا مزدوجًا فوق الدليل.
أدخل الموضع الجديد في مربع حوار دليل النقل وانقر فوق OK.
عرض المسافة بين الأدلة
اضغط Control (Windows) أو Command (Macintosh) وثبّت مؤشر الماوس في أي مكان بين الدليلين.
ملاحظة
وحدة القياس هي نفس وحدة القياس المستخدمة للمساطر.
محاكاة الطية (المنطقة المرئية) لمتصفح الويب
حدد View > Design View Options > Guides، ثم حدد حجم مستعرض معد مسبقًا من القائمة.
أزل دليلاً
اسحب الدليل خارج المستند.
تغيير إعدادات الدليل
حدد View > Design View Options > Guides > Edit Guides، ثم قم بتعيين الخيارات التالية، ثم انقر فوق OK.
Guide color
يحدد لون سطور الدليل. انقر فوق عينة اللون واختر لونًا من أداة اختيار الألوان، أو اكتب رقمًا سادس عشري في مربع النص.
Distance Color
تحدد لون الخطوط التي تظهر كمؤشرات مسافة عندما تحتفظ بمؤشر الماوس بين الأدلة. انقر فوق عينة اللون وحدد لونًا من أداة اختيار الألوان، أو اكتب رقمًا سادس عشري في مربع النص.
Show Guides
تجعل الأدلة ظاهرة في طريقة العرض Design.
Snap to Guides
تجعل عناصر الصفحة تنجذب إلى الأدلة عندما تحرك العناصر حول الصفحة.
Lock Guides
قفل الأدلة في مكانها.
Guides Snap to Elements
يحاذي الأدلة إلى العناصر على الصفحة حينما تقوم بسحب الأدلة.
Clear All
مسح كل الأدلة من الصفحة.
استخدام الأدلة مع القوالب
عندما تُضاف الأدلة إلى قالب Dreamweaver، ترث جميع نماذج القالب الأدلة. أما Guides في مثيلات القوالب، فيتم التعامل معها كمناطق قابلة للتحرير، لذا يمكن للمستخدمين تعديلها.يتم استعادة Guides المعدّلة في مثيلات القوالب إلى موقعها الأصلي كلما تم تحديث المثيل بالقالب الرئيسي.
يمكنك إضافة أدلتك الخاصة إلى مثيلات القالب. Guides المضافة بهذه الطريقة لا يتم استبدالها عند تحديث مثيل القالب بالقالب الرئيسي.
استخدام شبكة التخطيط
تعرض الشبكة نظامًا من الخطوط الأفقية والعمودية في نافذة المستند. إنها مفيدة لوضع الكائنات بدقة. يمكنك جعل عناصر الصفحة ذات الموضع المطلق تلتصق تلقائيًا بالشبكة أثناء تحريكها، وتغيير الشبكة أو التحكم في سلوك الالتصاق من خلال تحديد إعدادات الشبكة. يعمل الالتصاق سواء كانت الشبكة مرئية أم لا.
إظهار أو إخفاء الشبكة
حدد View > Design View Options > Grid > Show Grid.
إتاحة الانطباق أو تعطيله
حدد View > Design View Options > Grid > Snap to Grid.
تغيير إعدادات الشبكة
حدد View > Design View Options > Grid > Grid Settings.
قم بتعيين أي من الخيارات التالية، ثم انقر فوق OK لتطبيق التغييرات.
Color
يحدد لون سطور الشبكة. انقر فوق عينة اللون وحدد لونًا من أداة اختيار الألوان، أو اكتب رقمًا سادس عشري في مربع النص.
Show Grid
تجعل الشبكة ظاهرة في طريقة العرض Design.
Snap to Grid
تحاذي عناصر الصفحة بسطور الشبكة.
Spacing
تتحكم في مدى التباعد بين سطور الشبكة. أدخل رقمًا وحدد بكسل أو بوصة أو سنتيمتر من القائمة.
Display
يحدد ما إذا كانت سطور الشبكة تظهر كسطور أو نقاط.
ملاحظة
إذا لم يكن إظهار الشبكة محددًا، فلن تظهر الشبكة في المستند ولن تكون هناك تغييرات مرئية.
Use a tracing image
يمكنك استخدام صورة التتبع كدليل لإعادة إنشاء تصميم صفحة تم إنشاؤه في تطبيق رسومات مثل Adobe Freehand أو Fireworks.
صورة التتبع هي صورة JPEG أو GIF أو PNG يتم وضعها في خلفية نافذة المستند. يمكنك إخفاء الصورة وضبط شفافيتها وتغيير موضعها.
تكون صورة التتبع مرئية فقط في Dreamweaver؛ ولا تكون مرئية عند عرض الصفحة في المتصفح. عندما تكون صورة التتبع مرئية، فإن صورة الخلفية الحقيقية للصفحة ولونها لا يكونان مرئيين في نافذة المستند؛ ولكن ستكون صورة الخلفية واللون مرئيين عند عرض الصفحة في المتصفح.
وضع صورة تتبع في نافذة المستند
قم بأحد الإجراءات التالية:
حدد View > Design View Options > Tracing Image > Load.
حدد File > Page Properties، ثم في فئة Tracing Image، انقر فوق Browse (بجوار مربع نص Tracing Image).
انتقل إلى ملف الصورة ثم انقر فوق OK.
في مربع حوار خصائص الصفحة، حدد الشفافية
للصورة عن طريق سحب منزلق شفافية الصورة، ثم انقر فوق
موافق.
للتبديل لصورة تتبع مختلفة أو لتغيير شفافية صورة التتبع الحالية في أي وقت، حدد File > Page Properties.
عرض أو إخفاء صورة التتبع
حدد View > Design View Options >Tracing Image > Show.
غيّر موضع صورة التتبع
حدد View > Design View Options > Tracing Image > Adjust Position.
لتحديد موضع صورة التتبع بدقة، أدخل قيم الإحداثيات في مربعي النص X وY.
لتحريك الصورة بكسل واحد في كل مرة، استخدم مفاتيح الأسهم.
لتحريك الصورة 5 بكسل في كل مرة، اضغط على Shift ومفتاح سهم.
إعادة تعيين موضع صورة التتبع
حدد View > Design View Options > Tracing Image > Reset Position.
تعود صورة التتبع إلى الزاوية العلوية اليسرى من نافذة المستند (0,0).
محاذاة صورة التتبع مع عنصر محدد
حدد
عنصرًا في نافذة المستند.
حدد View > Design View Options > Tracing Image > Align with Selection.
الزاوية العلوية اليسرى لصورة القفز محاذاة مع الزاوية العلوية اليسرى للعنصر المحدد.
تعيين خصائص صورة القفز
قم بتعيين خصائص صورة القفز (وهي ملف صورة لاستخدامه كدليل في تصميم صفحتك).
قم بأحد الإجراءات التالية:
- انقر فوق File > Page Properties
- انقر فوق Window > Properties، ثم انقر فوق Page Properties في عارض خصائص النص.
من مربع حوار Page Properties، حدد Tracing Image. يمكنك تكوين الخيارات التالية من هذه اللوحة:
- صورة القفز: تحدد صورة لاستخدامها كدليل لنسخ التصميم. وتكون الصورة بمثابة مرجع فقط، ولا تظهر عند عرض المستند في أحد المستعرضات.
- الشفافية: تحدد درجة عتامة صورة القفز، من الشفاف تماماً إلى المعتم تماماً.
قم بإنشاء مواقع ويب جميلة في Dreamweaver
قم بتصميم مواقع الويب الديناميكية وبرمجتها وإدارتها في أداة قوية متكاملة.
