در این جلسه در طراحی سایت ایجاد صفحات چندگانه در HTML را باهم خواهیم آموخت:


یکی از امکاناتی که HTMLبرای طراحان فراھم آورده است این است که می توانیم به وسیله یکسری عناصر خاص به نمایش چندین صفحه وب در یک پنجره مرورگر بپردازیم. در اصل با این عناصر می توانیم پنجره مرورگر را به چندین قسمت (که ھر کدام frameگفته می شود) تقسیم کرده و در ھر قسمت یک صفحه را نمایش دھیم.


در ادامه با ساختار کلی و تگ ھای مربوط به چنین صفحاتی بیشتر آشنا خواھیم شد.


ساختار صفحات چندگانه


ساختار صفحاتی که میخواھیم در آن ھا چندین صفحه را قرار دھیم کمی با صفحه ھای معمولی فرق می کند.
ھمانطور که می دانید یک صفحه معمولی از قسمت سر که به وسیله تگ headو قسمت پیکره (بدنه) که به وسیله تگ bodyمشخص می شود، تشکیل می شود. در زیر ساختار کلی یک صفحه معمولی را مشاھده می کنید:

 <html>
 <head>
 .......
 </head>
 <body>
 .......
 </body>
 </html>


اما در ساختار صفحات چندگانه به جای عنصر  <body> از عنصری به نام  <fremeset> استفاده می شود. قبل و بعد از این عنصر نباید ھیچ عنصر دیگری قرار بگیرد در غیر اینصورت framesetتوسط مرورگرھا چشم پوشی می شود. ساختار کلی اینگونه صفحات به صورت زیر است:

 <html>
 <head>
 <title> Frameset </title>
 </head>
 <frameset cols="50%,50%">
 <frame src="http://www.google.com" name="google_frame" />
 <frame src="http://www.yahoo.com" name="yahoo_frame" />
 <frameset>
 </html>


می بینید که در اینگونھ صفحات از تگ ھای <frameset> برای ایجاد یک صفحه چندگانه و تگ <frame/> برای مشخص کردن صفحاتی که در ھر بخش نمایش داده خواھد شد استفاده می کنیم.
در ادامه به بررسی ھر یک از تگ 
ھای مرتبط با ایجاد صفحات چندگانه آشنا خواھیم شد:


تگ <frameset>:

از این تگ تگ برای ایجاد یک صفحه چندگانه استفاده می کنیم.
در واقع بااستفاده از این تگ برای اینکه به مرورگر می گوییم با یک صفحه چندگانه روبروست، استفاده می شود.


این تگ صفت ھای زیر را پشتیبانی می کند.


rows: برای ایجاد فریم ھای افقی به کار می رود.
از این صفت برای تعیین تعداد و اندازه ھر یک از فریم ھا استفاده می شود.
در واقع لیستی از اندازه ھا بر اساس واحدھای ، pxدرصد و نسبی خواھد بود.

cols: برای ایجاد فریم ھای عمودی به کار می رود.
از این صفت برای تعیین تعداد و اندازه ھر یک از فریم استفاده می شود.
در واقع لیستی از اندازه ھا بر اساس واحدھای ، pxدرصد و نسبی خواھد بود.


نکته : ھمانطور که اشاره شد یکی از انواع مقادیری که صفت ھای colsو rowsمی پذیرند مقادیر نسبی ھستند که با * مشخص می شوند. این مقادیر پس از محاسبه اندازه ھای مشخص شده با pxو درصد بر رویداد فضای باقیمانده عمل می کنند. به مثال زیر دقت کنید:

 <frameset cols="300px,50%,3*,2*,1*">


این تکه کد به آن معناست که ابتدا ۳۰۰pxبرای frameاول، سپس % ۵۰درصد از فضای باقیمانده برای feameدوم اختصاص داده می شود. پس از آن فضای باقیمانده به ۶قسمت کاملا مساوی تقسیم شده که ۳قسمت آن برای فریم سوم، دو قسمت برای فریم چھارم و یک قسمت برای فریم پنجم اختصاص داده می شود.


border: ضخامت borderبین ھر یک از فریم ھا را کنترل می کند. عددی صحیح را بر حسب pxمی پذیرد.
bordercolor:رنگ borderاطراف فریم ھا را مشخص می کند.
frameborder:نمایش یا عدم نمایش borderھای اطراف فریم ھا را مشخص می کند. مقادیر زیر را میپذیرد

yes یا۱:نمایش border

۰یا no:عدم نمایش border

رفتار می کندborder مثل صفت: framespacing

طراحی سایت اسپیناس همیشه سعی در استفاده از به روز ترین تکتینک ها و ابزارها در  طراحی سایت دارد  در اسپیناس از تکنولوژی ها روز دنیا مانند CSS3 , HTML5 , Jquery , JAVASCRIPT   در طراحی وب سایت استفاده می شود و همچنین زبانهایی مانند PHP , ASP  در شرکت اسپیناس مشتری مداری حرف اول را می زند

بارگذاری نوشته های مرتبط بیشتر
بارگذاری بیشتر در آموزش Html در طراحی سایت

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

1 + شانزده =

بررسی کنید

آموزش HTML5 (جلسه دوم) – تگ های ساختار صفحه

در دومین جلسه از طراحی سایت با HTML5 به تگ ھای ساختار صفحه خواھیم پرداخت. این تگ ھا ھمانطو…