كود HTML لتقسيم الصفحة

تقسيم الصفحة

ربما لاحظت أن هناك مواقع تقسم الصفحة إلى إطارات تماماً كتقسيم هذه الصفحة. حيث يمكنك وضع الإعلانات في جهة وقائمة بالأبواب التي تتخللها الصفحة بجهة. وأطار العرض في جهة . إلخ.. ولكن ما فائدة هذه التقاسيم؟ وكيف تقسم صفحتك بالطريقة التي تريدها؟

أهم فائدة لتلك التقاسيم أنك تستطيع التجول في الموقع بسرعة. ولست بحاجة للرجوع للخلف. كما أنك لست بحاجة لوضع الإعلانات مرة أخرة. وكما أن للتقسيم جوانبه الإيجابية فله جوانبه السلبية. وهي أن المستعرض سينزل أكثر من صفحة في بداية الأمر بدلاً من صفحة واحدة. مما يجعل المستعرض بطيئاً نسبياً في البداية. بالإضافة إلى أن صفحة العرض ستصبح أصغر.

وسم تقسيم الصفحةهو . ووسم التحكم في الإطار هو . ويمكنك تقسيم الصفحة تقسيم عمودي أو أفقي أو كلاهما.

لنفترض أنك تريد تقسيم الصفحة إلى ثلاثة أقسام، قسم الإعلان وقسم للقائمة الرئيسية وقسم للعرض،قسم الإعلان سيأخذ 50 بكسلاً وقسم القائمة الرئيسية سيأخذ 150 بكسلاً كالشكل التالي :-

ند النظر في الشكل أعلاه، ستلاحظ أن التقسيم الأفقي هو أول تقسيم. وبعد ذلك سيأتي التقسيم العمودي. حسناً.. لنفكر قليلاً.. تريد التقسيم الأفقي يقسم الصفحة إلى شطرين، وبما أن الإعلان سيأخذ 50 بكسل. إذاً ستكتب هذا السطر

ومعنى هذا أن التقسيم سيكون أفقي ROWS. القسم العلوي سيأخذ 50 بكسل الباقي "*" سيأخذه القسم السفلي.
- حسناً. هل أبدأ بالتقسيم العمودي؟

كلا... إذ أن التقسيم العمودي يأتي في القسم السفلي من التقسيم الأفقي. في هذه اللحظة يجب أن تعرف المستعرض ماذا سيكون في القسم العلوي من التقسيم الأفقي. وبعد ذلك تقسم الصفحة عمودي. وبما أن القسم العلوي سيأخذ الإعلان وهو الملف ad.html ستكتب السطر التالي:-

نأتي الآن إلى تقسيم القسم السفلي من التقسيم الأفقي. وسيكون بالتأكيد عمودي، القسم الأيسر للعرض والقسم الأيمن للقائمة الرئيسية والتي ستأخذ 150 بكسل، وبدلاً من ROWS استخدم COLS اختصار Columns أي أعمدة أكتب التالي:-

- حسناً هل هذا كل شيء؟

كلا .. بقي آخر خطوة من التقسيم. وهي أن القسم الأيسر سيكون للعرض main.html والقسم الأيمن سيكون للقائمة الرئيسية menu.html. وذلك بكتابة التالي.

- بعض المتصفحات لا تقبل تقسيم الصفحة. فما العمل؟

يمكنك استخدام الوسم وما بعد ذلك سيتعرف عليه المستعرض.

مثلاً. أكتب الآتي.

المتصفح لديك لا يقبل تقسيم الصفحات.

ها قد انتهينا من التقسيم و"ألم الرأس" ويمكنك كتابة الصفحات ad.html و main.html و menu.html على مزاجك.

- ولكن هل يمكنك كتابة الكود من البداية إلى النهاية؟

حسناً...

الكود:

<HTML>
<HEAD>
<TITLE>تقسيم الصفحة</TITLE>
</HEAD>
<FRAMESET ROWS="50,*">
<FRAME SRC="ad.html">
<FRAMESET COLS="*,150">
<FRAME SRC="main.html">
<FRAME SRC="menu.html">
</FRAMESET>
</FRAMESET>
<NOFRAME>
المتصفح لديك لا يقبل تقسيم الصفحات.
</NOFRAME>
</HTML>

اخي رامي
جميع مواضيعك رائعة و جميله
و انا حقا استفد من جميع مواضيعك
بنتظار جديدك

» كود html لتقسيم الصفحات table
» فلاش : اهدي هذه الصفحة لمن تحب
» html لها رأس و جسم
» كيف ربط css مع html
» كود وضع فلاش في صفحة html