امروزه اکثر صفحات با استفاده از لایه ها (div) ترسیم می شوند ، بنابراین مشکل ترازبندی سایت با مرکز پنجره مرورگر به مرکزیت لایه ای که عرض ناحیه قابل مشاهده صفحه را تعیین می کند ، کاهش می یابد. برای اینکه در وسط پنجره قرار بگیرد ، لازم است تنظیمات مناسب را برای عنصر اصلی آن یا برای خود این بلوک تنظیم کنید.
لازم است
دانش اولیه زبانهای HTML و CSS
دستورالعمل ها
مرحله 1
اگر می خواهید فقط با استفاده از زبان HTML انجام دهید ، لایه ای را که می خواهید قرار دهید در وسط پنجره ، بین قسمتهای باز و بسته شده برچسب مرکزی قرار دهید.. فرض خواهیم کرد که والد لایه ای که مرزهای صفحه را مشخص می کند متن اصلی این صفحه است. ساده ترین نسخه کد HTML با استفاده از برچسب مرکزی در این حالت ممکن است به این شکل باشد:
صفحه مرکز
متن صفحه
گام 2
اگر می خواهید از CSS (Cascading Style Sheets) برای تراز وسط قرار دادن صفحه استفاده کنید ، از اندازه اتوماتیک padding از مرزهای پنجره مرورگر استفاده کنید. اندازه های حاشیه در CSS با پارامتر margin تعیین می شود. برچسب های مرکزی را از نمونه قبلی بردارید و یک پارامتر حاشیه 0 خودکار به ویژگی سبک لایه ای که عرض صفحه را تعریف می کند اضافه کنید:
صفحه مرکز
متن صفحه
مرحله 3
البته می توان تعریف سبک را از ویژگی style خارج کرد و در یک پرونده خارجی یا در بالای سند قرار داد (بین برچسب ها و). در این حالت ، همان کد به صورت زیر خواهد بود:
صفحه مرکز
#pageFrame {
عرض: 700 پیکسل
ارتفاع: 400 پیکسل؛
پس زمینه: # 0BB؛
حاشیه: 0 خودکار؛
}
متن صفحه