صفحه اصلی وب سايت واقعآ محشر جستجو در سایت تماس با ما

طراحي حرفه اي وب سايت : طراحي وب سايت خود را به گروه فناوري اطلاعات ايران بسپاريد

طراحي وب سايت طراحي حرفه اي وب سايت بهينه سازي وب سايت

اصول طراحی صفحات حاوی فریم -- بخش اول

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

ایجاد صفحات با استفاده از فریمها

همانطور که در این مثال می توانید ملاحظه کنید در واقع با استفاده از فریمها، دو صفحه وب را در قالب یک صفحه نمایش می دهیم. هر کدام از صفحات در این مجموعه ( یعنی صفحاتی که در فریمها قرار گرفته اند و صفحه ای که فریمها در آن قرار دارند، کد html مربوط به خود را دارند.

برای ایجاد فریم در یک صفحه به جای تگ body از تگ frameset استفاده می کنیم. می توانیم برای ساخت صفحه ای که فریمها در آن قرار می گیرند از کد زیر استفاده کنیم:

<html>
<head>
<title>نمایش یک فریم ساده</title>
</head>
<frameset cols="50%,50%">
<frame src="page1.htm">
<frame src="page2.htm">
</frameset>
</html>

در اینجا به وظیفه تگهای مورد استفاده در اینجا می پردازیم:

  • <FRAMESET> :
    این تگ به مرورگر می گوید که به جای یک صفحه معمولی منتظر یک دسته فرم باشد.
  • "cols="50%,50% :
    این فرمان به مرورگر می گوید که صفحه را به دو قسمت عمودی تقسیم کند و پهنای هر کدام از این قسمتها نیمی از پهنای پنجره باشد. شما می توانید این نسبت را تغییر دهید یا به جای درصد از مقیاس پیکسل استفاده کنید. اما اگر می خواهید از مقیاس درصد استفاده کنید فراموش نکنید که از نشانه درصد یعنی % در بعد از هر عدد استفاده کنید. اگر فقط برای یکی از اعداد علامت درصد استفاده کنید مرورگر عدد دیگر را در مقیاس پیکسل فرض می کند.
  • <"FRAME SRC="frame_1.htm> :
    این فرمان آدرس صفحهء اولین فریم از سمت چپ را برای مرورگر مشخص می کند.
  • <"FRAME SRC="test2.htm> :
    این فرمان آدرس صفحه بعدی را برای فریم بعدی از سمت چپ مشخص می کند.

حالا فرض کنید ما به سه فریم نیاز داشته باشیم. می توانیم به صورت زیر عمل کنیم:

<html>

<head>
<title>نمایش سه فریم در یک صفحه </title>
</head>
<frameset cols="33%,33%,33%">
<frame src="page1.htm">
<frame src="page2.htm">
<frame src="page3.htm">
</frameset>

</html>

با این کد می توانیم سه فریم در یک صفحه داشته باشیم که هر کدام از آنها 33 درصد پهنای صفحه را در بر می گیرند. یک درصد باقیمانده را هم مرورگر تخصیص می دهد.
لینک زیر را کلیک کنید تا بتوانید نتیجه را ملاحظه کنید:

سه فریم در یک صفحه

فرض کنید می خواهیم فریمها را به صورت عمودی و زیر یکدیگر در صفحه قرار دهیم. در این صورت باید به جای شناسه cols در تگ frameset از شناسه rows استفاده کنیم.

به کد زیر توجه کنید:

<html>

<head>
<title>نمایش فریمها به صورت افقی و عمودی</title>
</head>
<frameset cols="50%,50%">
<frame src="page1.htm">
 <frameset rows="50%,50%">
<frame src="page2.htm">
<frame src="page3.htm">
</frameset>
</frameset>

</html>

لینک زیر را برای مشاهده نتیجه کلیک کنید:

فریمها به صورت افقی و عمودی

  1. ما با اوین تگ frameset به مرورگر می گوییم که صفحه را به دو قسمت ( دو ستون ) تقسیم کند.

  2. <"FRAME SRC="page1.htm> به مرورگر می گوید که ستون اول از سمت چپ باید با صفحه page1.htm پر شود.

  3. تگ frameset دوم درون تگ frameset اول قرار دارد. این تگ به مرورگر می گوید که ستون دوم را به دو ردیف افقی تقسیم کند. ( فریم دوم از سمت چپ خود به دو فریم تبدیل می شود )

  4. تگ <"FRAME SRC="page2.htm> به مرورگر می گوید که بالاترین فریم قرار گرفته در ستون دوم صفحه را با صفحه page2.htm پر کند.

  5. تگ <"FRAME SRC="page3.htm> به مرورگر می گوید که دومین فریم از بالا را در ستون دوم صفحه  با صفحه page3.htm پر کند.

در پایان فراموش نکنید که همه تگهای frameset باز شده را در پایان ببندید.


نظرات بازدید کنندگان
Wed, 04 Feb 2009 10:51:56 +0330 نویسنده : رضا
سلام توضیحات واقعا عالیه بهتر از این نمیشه صمیمانه تشکر میکنم.
 
Sun, 25 Jan 2009 15:05:47 +0330 نویسنده : دانا
باتشکر فراوان از این همه اطلاعاتی که در سایت گذاشته اید
 
Tue, 09 Dec 2008 21:02:10 +0330 نویسنده : مرضیه
سلام اگر بخوام یه طراح صفحات وب حرفه ای بشم باید با  چه نرم افزارهایی آشنا بشم
لطفا من رو راهنمایی کنید خیلی ممنون
 
Sat, 06 Dec 2008 13:10:46 +0330 نویسنده : اعظم
سلام : اگه می شه این مطالب آموزشی رو به ایمیلم بفرستید ..
 
Fri, 27 Jun 2008 08:21:33 +0430 نویسنده : ermak
ba arze salam, website khobi darin
ensha allah movafagh bashin
mer30
bye
 
Fri, 25 Apr 2008 13:54:43 +0430 نویسنده : ava
ba salam va tashakor az matalebe mofidetun
bebakhshid man ye site daram tarahi mikonam taghriban ba formate hamin site amoozeshi shoma yani samte rast shamele fehrest hala mikham hamintor bedum bazshodan safheh jadid ba click roye har fehrest matlabe arboot be onn baz besheh va dar zemn hamin fehrest ham samte rastesh namayesh dadeh beshe lotf mifarmaeed rahnamaee farmaeed .
ba arezooye moafaghiate roozafzoon baraye shoma
 
Tue, 11 Mar 2008 01:01:36 +0330 نویسنده : neamat
واقعا دستتون درد نکنه . خسته نباشین  ممنون از مطالب مفید و ارزشمندتون .
موفق باشیید