چگونه عناصر را به دقت روی صفحه قرار دهیم؟

تا همین اواخر، مدتب كردن متن و تصاویر گرافیكی در جایی كه می خواستید كمی سخت بود. متأسفنه، ایجاد طرح كلی دقیق با استفاده از جدول، با اینكه كار آمد است، می‌تواند وقت گیر باشد. اگر می‌دانید كه بازدیدكنندگان سایت شما را با مرورگرهای كنونی (برای مثال روی اینترانت شركت شما) مشاهده می‌كنند، عناصر را بصورت مطلق قرار دهید. مرورگرهایی مانند IE و Netscape Navigator (نسخه 4 و بالاتر) از قرار دادن عناصر بصورت مطلق پشتیبانی می‌كنند. حتی وقتی كه بازدید كنندگان، پنجره مرورگر خود را تنظیم می‌كنند، عناصری كه بصورت مطلق قرار گرفته‌اند دقیقاً در محلی قرار می‌گیرند كه آنها را قرار دارید.

نوار ابزار Positioning را باز كنید

صفحه مورد نظر را باز كنید. از منوی View گزینه Toolbars و بعد گزینه Positioning را انتخاب كنید تا نوار ابزار Positioning باز شود. این نوار ابزار را به قسمتی از صفحه كه راحت هستید منتقل كنید.

انتخاب عنصر مورد نظر

تصویر گرافیكی یا متنی كه می‌خواهید بصورت مطلق روی صفحه قرار دهید را انتخاب كنید. در این مثال، من متن عنوان را انتخاب كرده‌ام ولی شما می‌توانید تصویر را نیز انتخاب كنید.

روی Position Absolutely كلیك كنید

روی دكمه Position Absolutely در نوار ابزار Positioning كلیك كنید. مربع‌های انتخاب، حول عنصری كه انتخاب كردید را فرا می‌گیرند. كادرهای Left و Top در این نوار ابزار، محل این عنصر را نسبت به گوشه سمت چپ و بالای صفحه نشان می‌دهند.

تصویر را بصورت مطلق قرار دهید

اشاره گر را روی عنصر انتخاب شده ببرید تا به شكل یك فلش چهار جهته در آید. بعد عنصر را به محلی از صفحه كه مورد نظر شماست بكشید. توجه داشته باشید كه كادرهای Left و Top در نوار ابزار Positioning موقعیت جدید عنصر در صفحه را نشان می‌دهند.

روی Bring Forward كلیك كنید

شما می‌توانید یك شیء را روی شیء دیگری قرار دهید و بعد روی دكمه Bring Forward در نوار ابزار Positioning كلیك كنید. كادر Z _ Index در این نوار ابزار، موقعیت عنصر انتخاب شده را از نظر شماره لایه نشان می‌دهد. (یعنی آیا این شیء جلوی لایه اصلی قرار دارد یا پشت آن. لایه متنی اصلی، لایه صفر است). عدد مثبت نشان می‌دهد كه این شیء جلوی لایه متنی اصلی قرار دارد و عدد منفی، نشان می‌دهد كه این شئء پشت لایه اصلی قرار دارد.

روی Send Backward كلیك كنید

روی دكمه Send Backward در نوار ابزار Positioning كلیك كنید تا عنصر انتخاب شده، پشت عنصر دیگری مانند متن قرار گیرد. برای اینكه ببیند این صفحه در مرورگر چگونه نمایش داده خواهد شد، روی برگه Preview كلیك كنید (ممكن است این صفحه در این برگه، اندكی با این صفحه در برگه Normal فرق داشته باشد.)

*توجه *

تنظیم موقعیت بصورت مطلق یا با استفاده از جدول؟

در اكثر موارد، نمی‌دانید كه بازدیدكنندگان از چه مرورگری استفاده خواهند كرد. بنابراین نمی‌توانید مطمئن باشید كه تنظیم موقعیت بصورت مطلق، صفحه مرتب و خوانایی را ایجاد خواهد كرد. اگر نمی توانید پیش بینی كنید كه برای مشاهده صفحه، از كدام مرورگر استفاده خواهد شد، برای تراز كردن عناصر در صفحه، باید از جدول استفاده كنید. البته، در جدول، نمی توانید عناصر را روی یكدیگر قرار دهید، ولی بازدیدكنندگان می‌توانند محتویات صفحه را مشاهده كنند كه این به نظر من، یكی از اهداف مهم طراحی همین است.