كيف - مركز الموقع
تعرف على كيفية توسيط موقع الويب الخاص بك أفقيًا باستخدام CSS.
موقع المركز
تعرف على كيفية توسيط موقع الويب الخاص بك أفقيًا:
يتركز هذا المثال أفقيًا على الشاشات التي يزيد عرضها عن 500 بكسل.
كيفية توسيط موقع الويب الخاص بك
استخدم عنصر الحاوية وقم بتعيين ملف max-width
. العرض الشائع الذي تستخدمه العديد من مواقع الويب هو 960 بكسل. لتوسيط الصفحة فعليًا ، أضف margin: auto
.
المثال التالي سيركز موقع الويب على شاشات أكبر من 500 بكسل. على الشاشات التي يقل عرضها عن 500 بكسل ، ستمتد الشاشة بكامل الصفحة:
مثال
<style>
.content {
max-width: 500px;
margin: auto;
}
</style>
<body>
<div class="content">
<!-- Page content -->
</div>
</body>
هل سمعت عن W3Schools Spaces ؟ هنا يمكنك إنشاء موقع الويب الخاص بك من البداية أو استخدام قالب واستضافته مجانًا.
ابدأ مجانًا ❯* بطاقة الإئتمان غير مطالب بها