html 1
صفحه 1 از 1
html 1
تاريخچه
--------------------------------------------------------------------------------
در سال 1992 در دانشگاه مينه سوتا سيستمی به نام web به وجود آمد که دارای دو ويژگی خاص بود.
Graphic, Multi Media
Hyper Text (فقط کليک کردن و در سايت حرکت کردن )
صفحات اين سيستم توسط برنامه ای به نام HTML ساخته شد.
همچنين برای رد و بدل کردن اطلاعات:
(HTTP(Hyper Text Transfer Protocol
HTML Web page
HTML يک text عادی و در حقيقت زبانی برای مارک کردن فايلهای text به يکديگر می باشد که آن را با TAG مشخص کرده و به صورت <tag> می نويسند.
فرمت کلی يک فايل HTML:
--------------------------------------------------------------------------------
يک فايل HTML از دو بخش Body و Head ،تشکيل می شود. شکل ساده يک فايل HTML به صورت زير است.
<HTML>
<HEAD>
<TITLE> This is the title</TITLE>
<HEAD>
<BODY>
This is the the body
<BODY>
<HTML>
--------------------------------------------------------------------------------
همان طور که می بينيد، در بالای صفحه حاصل،متن نوشته شده در قسمت Title و در بدنه اصلی صفحه متن ما نوشته شده است.
تگ HEAD
در برچسب HEAD از برچسب به نامهای TITLE و BASE و META استفاده می شود.
<HEAD>
<TITLE> </TITLE>
<META> </META>
<BASE>
<HEAD>
TITLE:
برای تعيين لقب صفحه (چيزی که در قسمت Status Bar ديده می شود).
META:
1) برای تعيين نام و منبعی که برنامه توسط آن نوشته شده.
2) بهنگام کردن صفحات web توسط اين برچسب انجام می شود.
3) انتقال به يک صفحه ديگر web در زمان معيين.
مثال برای حالت اول: در اين حالت برای وارد کردن آدرس web خودمان به موتورهای جستجو در web (مثل yahoo و google و ...) از META استفاده می کنيم:
<META>
<META>
مثال برای حالت دوم و سوم:
<META>
با اين برچسب صفحه web بعد از 1 دقيقه بهنگام (refresh) خواهد شد.
در مثال بالا اگر در قسمت content به صورت زير عمل کنيم صفحه web بعد از 60 ثانيه به www.schoolnet.ir خواهد رفت:
Content="60; URL= http://www.schoolnet.ir"
BASE:
برای مشخص کردن مبدا آدرس دهی از صفحات web می باشد.
<BASE>
<BASE>
نکته مهم: در برنامه نويسی HTML برچسب ها به دو صورت با پايان و بی پايان نوشته می شوند.
<TAG>…………………………………</TAG> با پايان
<TAG> بی پايان
تگ BODY
قسمت دوم يک فايل HTML را Body تشکيل می دهد که دارای Attributeهای زير می باشد.
<BODY bgcolor = “رنگ پس زمينه صفحه”
background = “آدرس عکسی که به عنوان پس زمينه در صفحه وب قرار می گيرد. “
topmargin = “يک فضای خالی بالای صفحه بر حسب پيکسل ايجاد ما کند”
leftmargin = “يک فضای خالی سمت چپ صفحه بر حسب پيکسل ايجاد ما کند”
text ="color” رنگ متن را مشخص می کند
link = “color”
alink = “color” (active link)
vlink = “color” (visited link)>
نکته مهم: در برنامه HTML و در نوشتن تگها بزرگ و يا کوچک نوشتن حروف هيچ تاثيری ندارد.
Font:
با اين برچسب می توانيم مشخصات متن را به دلخواه خود درآوريم و فرمت کلی آن به صورت زير است.
<FONT> ........</FONT>
اين تگ دارای Attributeهای زير می باشد:
color: رنگ متن
size: اندازه متن
face: نوع متن
مثال: می خواهيم کلمه Schoolnet را با فونت نازنين و با اندازه normal و رنگ آبی بنويسيم.
<HTML>
<HEAD>
</HEAD>
<BODY>
<FONT size="3" color="blue"> Schoolnet </FONT>
</BODY>
</HTML>
--------------------------------------------------------------------------------
همانطور که می بينيد متن ما به رنگ آبی درآمده و اندازه آن نيز 3 شده است.
--------------------------------------------------------------------------------
نکته: اگر بخواهيم اندازه را نسبی مشخص کنيم يعنی نسبت به آنچه که قبلا بوده به صورت زير عمل می کنيم:
Size = +2
BOLD:
اول و آخر متن مورد نظر قرار گرفته و آنرا Bold می کند.
<B> text … </B>
ITALIC:
اول و آخر متن مورد نظر قرار گرفته و آنرا Italic می کند.
<I> text … </I>
UNDERLINE:
اول و آخر متن مورد نظر قرار گرفته و آنرا Underline می کند.
<U> text … </U>
ANCHOR:
در HTML بوسيله تگ <a> … </a> می توانيم يک متن يا عکس را به صفحه ای ديگر پيوند دهيم (Hyper link).مهمترين Attribute در اين تگ، href می باشد.
فرمت کلی اين تگ به صورت زير است.
<a> text/image </a>
مثال: در جمله click here to go to zahiri home page کلمه zahiri را به آدرس index.html لينک کنيم:
<BODY>
<p>
click here to go to
<a href="http://www.schoolnet.ir"> schoolnet </a>
home page
</p>
</BODY>
--------------------------------------------------------------------------------
همانطور که می بينيد کلمه مورد نظر به آدرسی که می خواهيم ، لينک شده است
--------------------------------------------------------------------------------
تگهايی که به وسيله آنها متن را فرم بندی می کنيم:
PARAGRAPH
<P> … </P>: در اين تگ همه موضوعات آن در يک خط نوشته شده يا يک پاراگراف ايجاد می شود که در صورت بوجود آمدن پاراگراف در زير خط اول، خط دوم را با فاصله زياد می نويسد.برای حل اين مشکل از تگ <BR> استفاده می کنيم.
تگ <P> دارای يک Attribute است:
<A align="left/center/right">
BREAK
<BR>: اين تگ از تگهايی است که پايان ندارد و آن را هر کجا که قرار دهيم کلمه بعدی را در يک خط پائين تر ولی با کمتر می نويسد.
NO BREAK
<NOBR> … </NOBR>: اگر بخواهيم در آخر خط شکستگی نداشته باشيم بين دو بخشی که شکسته می شود از اين تگ استفاده می کنيم.
مثال: <NOBR>a2</NOBR>
a, 2 را هرگز از هم جدا نمی کند.
HEADING
در HTML دارای شش نوع HEADING هستيم.
<H1> … </H1> بزرگترين
<H2> … </H2>
.
.
<H6> … </H6> کوچکترين
خود اين تگها خاصيت راست چين و چپ چين و يا وسط چين شدن را هم دارند که برای فعال کردن آن از روش زير استفاده می کنيم.
مثال: <H2> vali </H2>
HR
تگ <HR> برای ما تک خط افقی سه بعدی ايجاد می کند و دارای Attributeهای زير می باشد.
<HR align="left/center/right">
PRE
در HTML هر چيزی را که بين تگ <PRE> … </PRE> به هر صورتی که بنويسيم با همان شکل در صفحه وب نشان می دهد.
مثال:
<PRE> Vali
Ali …
Reza a b cd
</PRE>
--------------------------------------------------------------------------------
در سال 1992 در دانشگاه مينه سوتا سيستمی به نام web به وجود آمد که دارای دو ويژگی خاص بود.
Graphic, Multi Media
Hyper Text (فقط کليک کردن و در سايت حرکت کردن )
صفحات اين سيستم توسط برنامه ای به نام HTML ساخته شد.
همچنين برای رد و بدل کردن اطلاعات:
(HTTP(Hyper Text Transfer Protocol
HTML Web page
HTML يک text عادی و در حقيقت زبانی برای مارک کردن فايلهای text به يکديگر می باشد که آن را با TAG مشخص کرده و به صورت <tag> می نويسند.
فرمت کلی يک فايل HTML:
--------------------------------------------------------------------------------
يک فايل HTML از دو بخش Body و Head ،تشکيل می شود. شکل ساده يک فايل HTML به صورت زير است.
<HTML>
<HEAD>
<TITLE> This is the title</TITLE>
<HEAD>
<BODY>
This is the the body
<BODY>
<HTML>
--------------------------------------------------------------------------------
همان طور که می بينيد، در بالای صفحه حاصل،متن نوشته شده در قسمت Title و در بدنه اصلی صفحه متن ما نوشته شده است.
تگ HEAD
در برچسب HEAD از برچسب به نامهای TITLE و BASE و META استفاده می شود.
<HEAD>
<TITLE> </TITLE>
<META> </META>
<BASE>
<HEAD>
TITLE:
برای تعيين لقب صفحه (چيزی که در قسمت Status Bar ديده می شود).
META:
1) برای تعيين نام و منبعی که برنامه توسط آن نوشته شده.
2) بهنگام کردن صفحات web توسط اين برچسب انجام می شود.
3) انتقال به يک صفحه ديگر web در زمان معيين.
مثال برای حالت اول: در اين حالت برای وارد کردن آدرس web خودمان به موتورهای جستجو در web (مثل yahoo و google و ...) از META استفاده می کنيم:
<META>
<META>
مثال برای حالت دوم و سوم:
<META>
با اين برچسب صفحه web بعد از 1 دقيقه بهنگام (refresh) خواهد شد.
در مثال بالا اگر در قسمت content به صورت زير عمل کنيم صفحه web بعد از 60 ثانيه به www.schoolnet.ir خواهد رفت:
Content="60; URL= http://www.schoolnet.ir"
BASE:
برای مشخص کردن مبدا آدرس دهی از صفحات web می باشد.
<BASE>
<BASE>
نکته مهم: در برنامه نويسی HTML برچسب ها به دو صورت با پايان و بی پايان نوشته می شوند.
<TAG>…………………………………</TAG> با پايان
<TAG> بی پايان
تگ BODY
قسمت دوم يک فايل HTML را Body تشکيل می دهد که دارای Attributeهای زير می باشد.
<BODY bgcolor = “رنگ پس زمينه صفحه”
background = “آدرس عکسی که به عنوان پس زمينه در صفحه وب قرار می گيرد. “
topmargin = “يک فضای خالی بالای صفحه بر حسب پيکسل ايجاد ما کند”
leftmargin = “يک فضای خالی سمت چپ صفحه بر حسب پيکسل ايجاد ما کند”
text ="color” رنگ متن را مشخص می کند
link = “color”
alink = “color” (active link)
vlink = “color” (visited link)>
نکته مهم: در برنامه HTML و در نوشتن تگها بزرگ و يا کوچک نوشتن حروف هيچ تاثيری ندارد.
Font:
با اين برچسب می توانيم مشخصات متن را به دلخواه خود درآوريم و فرمت کلی آن به صورت زير است.
<FONT> ........</FONT>
اين تگ دارای Attributeهای زير می باشد:
color: رنگ متن
size: اندازه متن
face: نوع متن
مثال: می خواهيم کلمه Schoolnet را با فونت نازنين و با اندازه normal و رنگ آبی بنويسيم.
<HTML>
<HEAD>
</HEAD>
<BODY>
<FONT size="3" color="blue"> Schoolnet </FONT>
</BODY>
</HTML>
--------------------------------------------------------------------------------
همانطور که می بينيد متن ما به رنگ آبی درآمده و اندازه آن نيز 3 شده است.
--------------------------------------------------------------------------------
نکته: اگر بخواهيم اندازه را نسبی مشخص کنيم يعنی نسبت به آنچه که قبلا بوده به صورت زير عمل می کنيم:
Size = +2
BOLD:
اول و آخر متن مورد نظر قرار گرفته و آنرا Bold می کند.
<B> text … </B>
ITALIC:
اول و آخر متن مورد نظر قرار گرفته و آنرا Italic می کند.
<I> text … </I>
UNDERLINE:
اول و آخر متن مورد نظر قرار گرفته و آنرا Underline می کند.
<U> text … </U>
ANCHOR:
در HTML بوسيله تگ <a> … </a> می توانيم يک متن يا عکس را به صفحه ای ديگر پيوند دهيم (Hyper link).مهمترين Attribute در اين تگ، href می باشد.
فرمت کلی اين تگ به صورت زير است.
<a> text/image </a>
مثال: در جمله click here to go to zahiri home page کلمه zahiri را به آدرس index.html لينک کنيم:
<BODY>
<p>
click here to go to
<a href="http://www.schoolnet.ir"> schoolnet </a>
home page
</p>
</BODY>
--------------------------------------------------------------------------------
همانطور که می بينيد کلمه مورد نظر به آدرسی که می خواهيم ، لينک شده است
--------------------------------------------------------------------------------
تگهايی که به وسيله آنها متن را فرم بندی می کنيم:
PARAGRAPH
<P> … </P>: در اين تگ همه موضوعات آن در يک خط نوشته شده يا يک پاراگراف ايجاد می شود که در صورت بوجود آمدن پاراگراف در زير خط اول، خط دوم را با فاصله زياد می نويسد.برای حل اين مشکل از تگ <BR> استفاده می کنيم.
تگ <P> دارای يک Attribute است:
<A align="left/center/right">
BREAK
<BR>: اين تگ از تگهايی است که پايان ندارد و آن را هر کجا که قرار دهيم کلمه بعدی را در يک خط پائين تر ولی با کمتر می نويسد.
NO BREAK
<NOBR> … </NOBR>: اگر بخواهيم در آخر خط شکستگی نداشته باشيم بين دو بخشی که شکسته می شود از اين تگ استفاده می کنيم.
مثال: <NOBR>a2</NOBR>
a, 2 را هرگز از هم جدا نمی کند.
HEADING
در HTML دارای شش نوع HEADING هستيم.
<H1> … </H1> بزرگترين
<H2> … </H2>
.
.
<H6> … </H6> کوچکترين
خود اين تگها خاصيت راست چين و چپ چين و يا وسط چين شدن را هم دارند که برای فعال کردن آن از روش زير استفاده می کنيم.
مثال: <H2> vali </H2>
HR
تگ <HR> برای ما تک خط افقی سه بعدی ايجاد می کند و دارای Attributeهای زير می باشد.
<HR align="left/center/right">
PRE
در HTML هر چيزی را که بين تگ <PRE> … </PRE> به هر صورتی که بنويسيم با همان شکل در صفحه وب نشان می دهد.
مثال:
<PRE> Vali
Ali …
Reza a b cd
</PRE>
صفحه 1 از 1
صلاحيات هذا المنتدى:
شما نمي توانيد در اين بخش به موضوعها پاسخ دهيد