برسی کار با چارچوب ها در HTML

چارچوب ها در HTML

این مقاله نشان میدهد که چگونه اسناد FRAMESET بسازیم که مشخص کننده ی یک یا تعداد بیشتری اندازه ی چارچوب در HTML و خصوصیات برای FRAMESET ها و المان های چارچوب میباشد.در ادامه به همراه مثال هایی به برسی بیشرت این چارچوب میپردازیم.

شروع کار

چارچوب ها اجازه میدهند که چندین فایل HTML در آن واحد موجود باشند و بصورت پنجره هایی مستقل در یک browser اصلی حضور داشته باشند.

مثال

 

<HTML>
<HEAD>
<TITLE>FRAME EXAMPLE</TITLE>
</HEAD>
<frameset cols="25%,*,25%">
<frame src="FRAME1.html">
<frame src="FRAME2.html">
<frame src="FRAME3.html">
</frameset>
</HTML>

 

 

اسناد چارچوب ها

یک سند چارچوب ها میتواند اعلام کننده ی استفاده از المان FRAMESET باشد. یک سند Frameset HTML معمولی یک المان آغاز کننده و یک الملن پایان دهنده دارند. این المام میتواند شامل یک یا تعداد بیشتری المان باشد. صفت SRC المان frameset به اسنادی که شما میخواهید در یک چارچوب نمایش دهید اشاره میکند. صفت سطر ها و ستون های المان frameset مشخص کننده ی طرح چارچوب میباشد.

 

<HTML>
<HEAD>
<TITLE>FRAM EXAMPLE</TITLE>
</HEAD>
<FRAMESET cols="20%, 80%">
<FRAMESET rows="100, 200">
<FRAME src="contents_of_frame1.html">
<FRAME src="contents_of_frame2.gif">
</FRAMESET>
</FRAMESET>
</HTML>

 

 

نوع چارچوب

دو نوع چارچوب بر اساس طراحی آنها وجود دارد.

چارچوب های عمودی

برای چارچوب های عمودی از صفت COLS در المان frameset استفاده میشود. صفت COLS شامل پهنای ستون است. هر پهنای ستون یک ارزش است که با کاما از یکدیگر جدا میشوند.

مثال

 

<HTML>
<HEAD>
<TITLE>FRAME EXAMPLE</TITLE>
</HEAD>
<FRAMESET cols="25%, 75%,25%">
<FRAME src="contents_of_frame1.html">
<FRAME src="contents_of_frame2.gif">
</FRAMESET>
</HTML>

 

 

در مثال قبل سه ستون در frameset وجود داشتند. اولین و سومین ستون به ترتیب ۲۵ درصد و ۷۵ درصد از فضای صفحه را دربر میگیرند. از آنجایی که درخواست ۴ بخش دارد , اولین و سومین ستون یک چهارم از پنجره و دومین ستون نیمی از آن را دربر میگیرند.

چارچوب ها در HTML

چارچوب های افقی

صفت ROWS چارچوب های افقی را در HTML میسازد همانند صفت COLS. همینطور ارزشی که میگیرد برای ارتفاع ردیف میباشد.

مثال

 

<HTML>

<HEAD>

<TITLE>A simple frameset document</TITLE>

</HEAD>

<FRAMESET rows="100, 200">

<FRAME src="contents_of_frame1.html">

<FRAME src="contents_of_frame2.gif">

</FRAMESET>

</HTML>

 

 

چارچوب ها در HTML

چارچوب های توری

صفات سطر ها و ستون ها یک چارچوب توری را میسازد. صفت FRAMEBORDER برای تعیین پهنای مرز توری و صفت BORDERCOLOR تعیین کننده ی رنگ توری میباشد. ارزش ۰ در FRAMEBORDER مرز را از چارچوب حذف میکند.

 

<HTML>
<HEAD>
<TITLE>FRAME EXAMPLE</TITLE>
</HEAD>
<frameset cols="25%,*,25%">
<frame src="FRAME1.html" border="yellow" frameborder="1">
<frame src="FRAME1.html" border="Red" frameborder="0">
<frame src="FRAME2.html">
<frame src="FRAME3.html">
</frameset>
</HTML>

 

 

حاشیه های چارچوب نیز میتوانند با استفاده از MARGINHEIGHT و MARGINWIDTH تعیین شوند. صفت MARGINHEIGHT برای تعیین کردن حاشیه های بالا و پایین چارچوب هستند و صفت MARGINWIDTH برای چپ و راست.

چارچوب هایی با قابلیت تغییر سایز و نوار Scroll در چارچوب

معمولا صفت Size توری هایی با قابلیت تغییر سایز میسازند. گاهی اوقات شما میخواهید اندازه ی چارچوب ها را به کوچک و بزرگ تغییر دهید با کشیدن مرز های چارچوب. صفت SCROLLING به نوار Scroll چارچوب اجازه میدهد که پیدا یا پنهان باشد. ارزش Yes در صفت Scrolling , آشکار بودن Scroll را روشن میکند و NO , Scroll را پنهان میکند. به طور خودکار ارزش Scroll بر روی آشکار تعیین میشود و تحت شرایطی نیز پنهان تعیین میشود.

مثال

 

<HTML>

<HEAD>

<TITLE>FRAME EXAMPLE</TITLE>

</HEAD>

<frameset cols="25%,*,25%">

<frame src="FRAME1.html" border="yellow" frameborder="1" scrolling="yes">

<frame src="FRAME2.html" scrolling="NO">

<frame src="FRAME3.html" scrolling="auto">

</frameset>

</HTML>

 

 

خلاصه

امیدوارم که این مقاله به شما در یادگیری کمک کند وتوضیح چگونگی استفاده از چارچوب ها در HTML  و تعیین خصوصیت هایی با مقادیر مشخص برای الملن FRAMESET.

داریوش فرخی

داریوش فرخی هستم از سال 92 شروع به یادگیری برنامه نویسی و از سال 93 در بخش برنامه نویسی و تولید محتوای سایت mspsoft.com مشغول هستم. فعالیتم نیز بیشتر در زمینه های برنامه نویسی با سی شارپ و asp.net بوده است. اوقات فراغتم را هم غالبا با تماشای فیلم یا بازی های کامپیوتری پر میکنم .

نوشته‌های مرتبط

دیدگاه‌ها

*
*

این سایت از اکیسمت برای کاهش هرزنامه استفاده می کند. بیاموزید که چگونه اطلاعات دیدگاه های شما پردازش می‌شوند.

ما یک پرسشنامه‌ی کوچولو داریم، که قول میدیم وقتتون رو خیلی نمی‌گیره، ولی کلی به ما کمک می‌کنه، چون هم assessment مونه ,و هم شما به ما در این زمینه کمک میکنید.بزن بریم