|
|
| (۲ نسخهٔ میانی ویرایش شده توسط ۱ کاربر نشان داده نشده) |
| سطر ۱: |
سطر ۱: |
| − | <p><b>HTML چيست ؟</b><br>
| + | =HTML چیست ؟= |
| − | مخفف كلمه hyper text markup language ميباشد و عموماً فايلهاي اين كدنويسي با
| + | |
| − | پسوند html و htm معرفي ميشوند.<br>
| + | |
| − | هر فايل HTML حاوی برچسبهای (تگها) کوچک نشانه گذاریست و اين برچسبها هستند كه
| + | |
| − | به مرورگر بيان ميكنند كه صفحه را چگونه نمايش دهند و یک فایل HTML میتواند توسط
| + | |
| − | یک ویرایشگر متنی ساده همچون notepad ساخته شود.<br>
| + | |
| − | كدنويسي در اين زبان بسيار ساده هست و نياز به صرف زمان اندكي دارد و ميتوانيد در
| + | |
| − | مدت يك هفته به اين زبان مسلط شويد.<br>
| + | |
| − | براي شروع لازم هستش كه كد زير را تحليل كنيم :</p>
| + | |
| − | <p align="left"><br>
| + | |
| − | <font color="#008080"><html><br>
| + | |
| − | <head><br>
| + | |
| − | <title>عنوان صفحه</title><br>
| + | |
| − | </head><br>
| + | |
| − | <body><br>
| + | |
| − | متن معمولي<b> متن درشت خط </b><br>
| + | |
| − | </body><br>
| + | |
| − | </html></font></p>
| + | |
| − | <p><br>
| + | |
| − | اگر دقت كنيد هركدي كه آغاز ميشود در خطهاي بعدي به كد خاتمه خود ختم ميشود. بطور
| + | |
| − | مثال : برچسب <html> كه با </html> به پايان ميرسد.<br>
| + | |
| − | در واقع اولین برچسب در فایل HTML شما ، <html> است.این برچسب به مرورگر شما
| + | |
| − | ميفهماند که این آغاز یک فایل HTML است، آخرین برچسب در فایل شما <html/> است.این
| + | |
| − | برچسب به فایل شما میفهماند که این انتهاي یک فایل HTML است.<br>
| + | |
| − | مطالب واقع در ميان برچسب head در نماي كلي صفحه نمايش داده نميشوند و كاربرد خارج
| + | |
| − | از قسمت نمايش اصلي (body) هستند. همانگونه كه مشاهده ميكنيد برچسب title در دل
| + | |
| − | اين برچسب قرار گرفته است و وظيفه نمايش عنوان صفحه را دارد.<br>
| + | |
| − | محتويات سايت شما در بين برچسب body قرار ميگيرد و متني كه در ميان <b> قرار
| + | |
| − | ميگيرد به شكل درشت خط و يا Bold نمايش داده ميشود. <font color="#FF0000">توجه :
| + | |
| − | در كدنويسي به اين سبك B و b تفاوتي ندارند ولي بهتر است خود را با حروف كوچك عادت
| + | |
| − | دهيد. </font><br>
| + | |
| − | </p>
| + | |
| − | <p><br>
| + | |
| − | <b>حال زمان آنست كه با برخي از برچسبها و عناصر ديگر html آشنا شويد:</b><br>
| + | |
| − | عنصرBgcolor به منظور معرفي يك زمينه براي صفحه يا جدول شما كاربرد دارد و در body
| + | |
| − | به اين شكل اضافه ميشود : <font color="#008080"><body bgcolor="green"></font> و
| + | |
| − | در بين برچسب body قرار ميگيرد. <font color="#FF0000">توجه : عناصر همیشه به
| + | |
| − | برچسب شروع عناصر HTML اضافه می شوند.</font><br>
| + | |
| − | برچسب table به منظور ايجاد يك جدول در صفحه ميباشد.<br>
| + | |
| − | عنصر border براي تعيين اندازه لبههاي جدول كاربرد دارد و در ميان برچسب جدول مورد
| + | |
| − | نظر قرار ميگيرد. براي قرار گرفتن در بين جدول مورد نظر بايد به شكل <font color="#008080"><table
| + | |
| − | border="0"></font> وارد كنيد. <font color="#FF0000">توجه : عناصر همیشه در یک زوج
| + | |
| − | نام/مقدار می آیند، مانند : نام="مقدار"</font><br>
| + | |
| − | <br>
| + | |
| − | <b>سرتيترها</b> :<br>
| + | |
| − | سر تیترها با برچسب های <h1>تا<h6>معرفی می شوند. <h1>بیانگر بزرگترین سرتیتر
| + | |
| − | و<h6> بیانگر کوچکترین سر تیتر است.<br>
| + | |
| − | <b>پاراگرافها</b> :<br>
| + | |
| − | پاراگراف ها با برچسب <p> معرفی می شوند.HTML بطور خودکار فضای خالی اضافی به قبل و
| + | |
| − | بعد از یک پاراگراف اضافه می کند.<br>
| + | |
| − | <b>پرش به خط بعد</b> :<br>
| + | |
| − | برچسب <br> هنگامی استفاده می شود که بخواهیم یک خط را پایان دهیم اما نمی خواهیم
| + | |
| − | یک پاراگراف جدید را آغاز کنیم.برچسب <br> شما را از هر جا که قرار دارید به یک خط
| + | |
| − | پایین تر می برد. برچسب <br> یک برچسب تکی است و هیچ برچسب پایانی ندارد.<br>
| + | |
| − | برچسب <hr> نيز یک خط افقی را معرفی می کند.<br>
| + | |
| − | <br>
| + | |
| − | <b>برچسب Anchor و موجودیت Href</b> :<br>
| + | |
| − | HTML از برچسب <a> برای ساخت یک پیوند به پرونده های دیگر استفاده می کند. یک
| + | |
| − | anchor می تواند به هر منبعی در وب اشاره کند.<br>
| + | |
| − | دستورالعمل : <font color="#008080"><a href="url"> متن مورد نظر </a></font><br>
| + | |
| − | <b>موجودیت Target</b> :<br>
| + | |
| − | با موجودیت هدف شما می توانید معرفی کنید که پرونده های پیوند داده شده کجا باز
| + | |
| − | شوند. خط زیر پرونده ای را در یک پنجره مرورگر جدید باز خواهد کرد.<br>
| + | |
| − | دستورالعمل : <font color="#008080"><a href="url" target="_blank"> متن مورد نظر
| + | |
| − | </a> </font><br>
| + | |
| − | توجه داشته باشيد بسته به نياز شما مقدار blank_ تغيير ميكند و ممكن است new_
| + | |
| − | باشد.<br>
| + | |
| − | <br>
| + | |
| − | <b>سر تیترها در جداول</b> :<br>
| + | |
| − | سرتیترها در یک جدول با برچسب <th>مشخص می شوند<br>
| + | |
| − | <br>
| + | |
| − | <b>لیست های نامرتب</b> :<br>
| + | |
| − | یک لیست نامرتب ، لیستی از اقلام است.اقلام لیست بوسیله گلوله نشانه گذاری می شوند)
| + | |
| − | معمولا یک دایره سیاه کوچک). یک لیست نامرتب با یک برچسب <ul> آغاز می شوند.هر کدام
| + | |
| − | از اقلام لیست با برچسب <li> آغاز می شوند.<br>
| + | |
| − | <b>لیست های مرتب</b> :<br>
| + | |
| − | یک لیست مرتب شده نیز لیستی از اقلام است. اقلام لیست بوسیله شماره نشانه گذاری می
| + | |
| − | شوند.یک لیست مرتب با برچسب <ol> آغاز می شود.هرکدام از اقلام لیست با برچسب <li>
| + | |
| − | آغاز می شوند.<br>
| + | |
| − | <br>
| + | |
| − | <b>فرمها</b> :<br>
| + | |
| − | یک فرم ، منطقه ای حاوی عناصر فرم است.عناصر فرم ، عناصری هستند که به کاربر اجازه
| + | |
| − | می دهند تا اطلاعات را (مثل فیلدهای متنی ، فیلدهای text area ، لیست های پایین
| + | |
| − | افتان، دکمه های رادیویی ، چک باکس ها و...) در فرم وارد کند.یک فرم با برچسب
| + | |
| − | <form> معرفی می شود.<br>
| + | |
| − | در برچسب <form> برچسب <input>بیشترین استفاده را دارد.نوع ورودی با خواص آن تعیین
| + | |
| − | می شود.<br>
| + | |
| − | مثال : <<font color="#008080">input type="text" name="firstname" ></font><br>
| + | |
| − | دكمههاي راديويي : <<font color="#008080">input type="radio" name="city"
| + | |
| − | value="Tehran" > Tehran </form></font><br>
| + | |
| − | چك باكسها : <<font color="#008080">input type="checkbox" name="Text"></font><br>
| + | |
| − | دكمه ارسال فرم : <<font color="#008080">input type="submit" value="Send"></font><br>
| + | |
| − | <br>
| + | |
| − | <b>برچسب Images و موجودیت Src</b> :<br>
| + | |
| − | در HTML عکس ها با برچسب <img > معرفی می شوند.برچسب <img > خالی است بدین معنا که
| + | |
| − | آن فقط حاوی موجودیتها است و برچسب پایانی ندارد.<br>
| + | |
| − | برای نمایش یک تصویر در یک صفحه، شما احتیاج دارید که از موجودیت Src استفاده کنید.
| + | |
| − | Src مخفف source (منبع) است. محتوای موجودیتurl ، Src تصویری است که شما می خواهید
| + | |
| − | در صفحه تان نمایش دهید. نحوه معرفی یک تصویربه شكل زير است :</p>
| + | |
| − | <p align="left"><br>
| + | |
| − | <font color="#008080"><"img src="url ></font></p>
| + | |
| − | <p><br>
| + | |
| − | url به محلی اشاره می کند که تصویر در آنجا قرار دارد . تصویری که "pic.gif" نامیده
| + | |
| − | شده در دایرکتوری "images" در "www.yoursite" دارای این url است: </p>
| + | |
| − | <p align="left"><font color="#008080"><br>
| + | |
| − | http://yoursite/images/pic.gif</font></p>
| + | |
| − | <p><br>
| + | |
| − | مرورگر تصویر را جایی قرار می دهد که بر چسب تصویر پرونده در آنجا قرار گرفته
| + | |
| − | است.اگر شما برچسب تصویر را بین دو پاراگراف قرار دهید ، مرورگر ابتدا پاراگراف اول
| + | |
| − | ، سپس تصویر و سپس پاراگراف دوم را نشان می دهد.<br>
| + | |
| − | موجودیت Alt :برای معرفی متن جایگزین به جای یک تصویر استفاده می شود. محتوای
| + | |
| − | موجودیت Alt یک متن توصیفی است: </p>
| + | |
| − | <p align="left"><font color="#008080"><br>
| + | |
| − | <"img src="url" alt="My Picture></font></p>
| + | |
| − | <p><br>
| + | |
| − | اگر مرورگر نتواند تصویری را بارگیری نماید ، موجودیت alt به خواننده می گوید که آن
| + | |
| − | را در صفحه از دست داده است ، سپس مرورگر متن جایگزین را بجای آن نشان خواهد داد.</p>
| + | |
| − | <p><br>
| + | |
| − | ------------------------------------------------------------------------------- <br>
| + | |
| − | اين مقاله براي درك بهتر مفاهيم html در قالب مامبو و جوملا ميباشد و جنبه آموزشي
| + | |
| − | ندارد. براي آموزش اين كدنويسي و درك بهتر مفاهيم مطرح شده به سايت
| + | |
| − | http://www.html.ir مراجعه كنيد و اين كدنويسي را همراه با مثال و مطالب گستردهتري
| + | |
| − | فرا بگيريد.<br>
| + | |
| − | موفق باشيد.</p>
| + | |
| | | | |
| − | [[رده:زبان های برنامه نویسی تحت وب]] | + | مخفف کلمه hyper text markup language میباشد و عموماً فایلهای این کدنویسی با پسوند html و htm معرفی میشوند. |
| | + | |
| | + | هر فایل [[HTML]] حاوی برچسبهای (تگها) کوچک نشانه گذاریست و این برچسبها هستند که به [[مرورگر]] بیان میکنند که صفحه را چگونه نمایش دهند و یک فایل [[HTML]] میتواند توسط یک ویرایشگر متنی ساده همچون notepad ساخته شود. |
| | + | |
| | + | کدنویسی در این زبان بسیار ساده هست و نیاز به صرف زمان اندکی دارد و میتوانید در مدت یک هفته به این زبان نسبتاً مسلط شوید. |
| | + | |
| | + | برای شروع لازم است تا کد زیر را تحلیل کنیم : |
| | + | |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <html> |
| | + | <head> |
| | + | <title>عنوان صفحه</title> |
| | + | </head> |
| | + | <body> |
| | + | متن معمولی<b> متن درشت خط </b> |
| | + | </body> |
| | + | </html> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | اگر دقت کنید هر کدی که آغاز میشود در خطهای بعدی به کد خاتمه خود ختم میشود. |
| | + | |
| | + | ''بطور مثال:'' برچسب <html> که با </html> به پایان میرسد. |
| | + | |
| | + | در واقع اولین برچسب در فایل [[HTML]] شما ، <nowiki><html></nowiki> است.این برچسب به [[مرورگر]] میفهماند که این آغاز یک فایل [[HTML]] است، آخرین برچسب در فایل شما <nowiki><html/></nowiki> است.این برچسب به فایل شما میفهماند که این انتهای یک فایل [[HTML]] است. |
| | + | |
| | + | مطالب واقع در میان برچسب head در نمای کلی صفحه نمایش داده نمیشوند و کاربرد خارج از قسمت نمایش اصلی (body) هستند. همانگونه که مشاهده میکنید برچسب title در دل این برچسب قرار گرفته است و وظیفه نمایش عنوان صفحه را دارد. |
| | + | |
| | + | محتویات سایت شما در بین برچسب body قرار میگیرد و متنی که در میان <nowiki><b></nowiki> قرار میگیرد به شکل درشت خط و یا Bold نمایش داده میشود. |
| | + | |
| | + | ''توجه:'' در کدنویسی به این سبک B و b تفاوتی ندارند ولی بهتر است خود را با حروف کوچک عادت دهید. |
| | + | |
| | + | =برچسبها و عناصر دیگر= |
| | + | |
| | + | حال زمان آنست که با برخی از برچسبها و عناصر دیگر html آشنا شوید: |
| | + | |
| | + | عنصر Bgcolor به منظور معرفی یک زمینه برای صفحه یا جدول شما کاربرد دارد و در body به این شکل اضافه میشود : |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <div dir=ltr><body bgcolor="green"></div> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | و در بین برچسب body قرار میگیرد. |
| | + | |
| | + | ''توجه:'' عناصر همیشه به برچسب شروع عناصر [[HTML]] اضافه میشوند. |
| | + | |
| | + | برچسب table به منظور ایجاد یک جدول در صفحه میباشد. |
| | + | |
| | + | عنصر border برای تعیین اندازه لبههای جدول کاربرد دارد و در میان برچسب جدول مورد نظر قرار میگیرد. برای قرار گرفتن در بین جدول مورد نظر باید به صورت زیر کدها را وارد کنید. |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <div dir=ltr><table border="0"></div> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | ''توجه:'' عناصر همیشه در یک زوج نام/مقدار میآیند، مانند : نام="مقدار" |
| | + | |
| | + | ==سرتیترها== |
| | + | |
| | + | سر تیترها با برچسبهای <nowiki><h1></nowiki>تا<nowiki><h6></nowiki> معرفی میشوند. <nowiki><h1></nowiki> بیانگر بزرگترین سرتیتر و <nowiki><h6></nowiki> بیانگر کوچکترین سرتیتر است. |
| | + | |
| | + | ==پاراگرافها== |
| | + | |
| | + | پاراگرافها با برچسب <nowiki><p></nowiki> معرفی میشوند. [[HTML]] بطور خودکار فضای خالی اضافی به قبل و بعد از یک پاراگراف اضافه می کند. |
| | + | |
| | + | ==پرش به خط بعد== |
| | + | |
| | + | برچسب <nowiki><br></nowiki> هنگامی استفاده میشود که بخواهیم یک خط را پایان دهیم اما نمیخواهیم یک پاراگراف جدید را آغاز کنیم.برچسب <nowiki><br></nowiki> شما را از هر جا که قرار دارید به یک خط پایینتر میبرد. برچسب <nowiki><br></nowiki> یک برچسب تکی است و هیچ برچسب پایانی ندارد. |
| | + | |
| | + | برچسب <nowiki><hr></nowiki> نیز یک خط افقی را معرفی می کند. |
| | + | |
| | + | ==برچسب Anchor و موجودیت Href :== |
| | + | |
| | + | [[HTML]] از برچسب <nowiki><a></nowiki> برای ساخت یک پیوند به پروندههای دیگر استفاده میکند. یک anchor میتواند به هر منبعی در [[وب]] اشاره کند. |
| | + | |
| | + | دستورالعمل: |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <a href="url"> متن مورد نظر </a> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | ==موجودیت Target== |
| | + | |
| | + | با موجودیت هدف شما میتوانید معرفی کنید که پروندههای پیوند داده شده کجا باز شوند. خط زیر پروندهای را در یک پنجره [[مرورگر]] جدید باز خواهد کرد. |
| | + | |
| | + | دستورالعمل: |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <a href="url" target="_blank"> متن مورد نظر </a> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | توجه داشته باشید بسته به نیاز شما مقدار blank_ تغییر میکند و ممکن است new_ باشد. |
| | + | |
| | + | ==سرتیترها در جداول== |
| | + | |
| | + | سرتیترها در یک جدول با برچسب <nowiki><th></nowiki> مشخص میشوند. |
| | + | |
| | + | ==لیستهای نامرتب== |
| | + | |
| | + | یک لیست نامرتب ، لیستی از اقلام است.اقلام لیست بوسیله گلوله نشانه گذاری میشوند (معمولا یک دایره سیاه کوچک). یک لیست نامرتب با یک برچسب <nowiki><ul></nowiki> آغاز میشوند. هر کدام از اقلام لیست با برچسب <nowiki><li></nowiki> آغاز میشوند. |
| | + | |
| | + | ==لیستهای مرتب== |
| | + | |
| | + | یک لیست مرتب شده نیز لیستی از اقلام است. اقلام لیست بوسیله شماره نشانه گذاری میشوند.یک لیست مرتب با برچسب <nowiki><ol></nowiki> آغاز میشود.هرکدام از اقلام لیست با برچسب <nowiki><li></nowiki> آغاز میشوند. |
| | + | |
| | + | ==فرمها== |
| | + | |
| | + | یک فرم ، منطقهای حاوی عناصر فرم است.عناصر فرم ، عناصری هستند که به کاربر اجازه میدهند تا اطلاعات را (مثل فیلدهای متنی ، فیلدهای text area ، لیست های پایین افتان، دکمه های رادیویی ، چک باکسها و...) در فرم وارد کند.یک فرم با برچسب <nowiki><form></nowiki> معرفی میشود. |
| | + | |
| | + | در برچسب <nowiki><form></nowiki> برچسب <nowiki><input></nowiki> بیشترین استفاده را دارد.نوع ورودی با خواص آن تعیین میشود. |
| | + | |
| | + | ===مثال=== |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <input type="text" name="firstname" > |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | ===دکمههای رادیویی=== |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <input type="radio" name="city" value="Tehran" > Tehran </form> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | ===چک باکسها=== |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <input type="checkbox" name="Text"> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | ===دکمه ارسال فرم=== |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <input type="submit" value="Send"> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | ==برچسب Images و موجودیت Src== |
| | + | |
| | + | در [[HTML]] عکسها با برچسب <nowiki><img ></nowiki> معرفی میشوند.برچسب <nowiki><img ></nowiki> خالی است بدین معنا که آن فقط حاوی موجودیتها است و برچسب پایانی ندارد. |
| | + | |
| | + | برای نمایش یک تصویر در یک صفحه، شما احتیاج دارید که از موجودیت Src استفاده کنید. Src مخفف source (منبع) است. محتوای موجودیت url ، Src تصویری است که شما می خواهید در صفحه تان نمایش دهید. نحوه معرفی یک تصویر به صورت زیر است : |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <img src="url"> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | url به محلی اشاره میکند که تصویر در آنجا قرار دارد . تصویری که "pic.gif" نامیده شده در دایرکتوری "images" در "www.yoursite" دارای این url است: |
| | + | |
| | + | <nowiki>http://yoursite/images/pic.gif</nowiki> |
| | + | |
| | + | [[مرورگر]] تصویر را جایی قرار میدهد که برچسب تصویر پرونده در آنجا قرار گرفته است.اگر شما برچسب تصویر را بین دو پاراگراف قرار دهید ، [[مرورگر]] ابتدا پاراگراف اول ، سپس تصویر و سپس پاراگراف دوم را نشان می دهد. |
| | + | |
| | + | ==موجودیت Alt== |
| | + | |
| | + | برای معرفی متن جایگزین به جای یک تصویر استفاده می شود. محتوای موجودیت Alt یک متن توصیفی است: |
| | + | |
| | + | <source lang="php"> |
| | + | /* (...) */ |
| | + | <img src="url" alt="My Picture"> |
| | + | /* (...) */ |
| | + | </source> |
| | + | |
| | + | اگر [[مرورگر]] نتواند تصویری را بارگیری نماید ، موجودیت alt به خواننده میگوید که آن را در صفحه از دست داده است ، سپس [[مرورگر]] متن جایگزین را بجای آن نشان خواهد داد. |
| | + | |
| | + | این مقاله برای درک بهتر مفاهیم html میباشد و جنبه آموزشی ندارد. برای آموزش این برنامه نویسی و درک بهتر مفاهیم مطرح شده، به سایت <nowiki>http://www.html.ir</nowiki> مراجعه کنید و این کدنویسی را همراه با مثال و مطالب گستردهتری فرا بگیرید. |
| | + | |
| | + | ---- |
| | + | |
| | + | '''منبع : سایت html.ir''' |
| | + | |
| | + | {{کپی رایت}} |
| | + | |
| | + | [[رده:زبان برنامه نویسی تحت وب]] |
مخفف کلمه hyper text markup language میباشد و عموماً فایلهای این کدنویسی با پسوند html و htm معرفی میشوند.
کدنویسی در این زبان بسیار ساده هست و نیاز به صرف زمان اندکی دارد و میتوانید در مدت یک هفته به این زبان نسبتاً مسلط شوید.
مطالب واقع در میان برچسب head در نمای کلی صفحه نمایش داده نمیشوند و کاربرد خارج از قسمت نمایش اصلی (body) هستند. همانگونه که مشاهده میکنید برچسب title در دل این برچسب قرار گرفته است و وظیفه نمایش عنوان صفحه را دارد.
محتویات سایت شما در بین برچسب body قرار میگیرد و متنی که در میان <b> قرار میگیرد به شکل درشت خط و یا Bold نمایش داده میشود.
عنصر Bgcolor به منظور معرفی یک زمینه برای صفحه یا جدول شما کاربرد دارد و در body به این شکل اضافه میشود :
عنصر border برای تعیین اندازه لبههای جدول کاربرد دارد و در میان برچسب جدول مورد نظر قرار میگیرد. برای قرار گرفتن در بین جدول مورد نظر باید به صورت زیر کدها را وارد کنید.
</div>
/* (...) */
</source>
توجه: عناصر همیشه در یک زوج نام/مقدار میآیند، مانند : نام="مقدار"
سرتیترها
سر تیترها با برچسبهای <h1>تا<h6> معرفی میشوند. <h1> بیانگر بزرگترین سرتیتر و <h6> بیانگر کوچکترین سرتیتر است.
پاراگرافها
پاراگرافها با برچسب <p> معرفی میشوند. HTML بطور خودکار فضای خالی اضافی به قبل و بعد از یک پاراگراف اضافه می کند.
پرش به خط بعد
برچسب <br> هنگامی استفاده میشود که بخواهیم یک خط را پایان دهیم اما نمیخواهیم یک پاراگراف جدید را آغاز کنیم.برچسب <br> شما را از هر جا که قرار دارید به یک خط پایینتر میبرد. برچسب <br> یک برچسب تکی است و هیچ برچسب پایانی ندارد.
برچسب <hr> نیز یک خط افقی را معرفی می کند.
برچسب Anchor و موجودیت Href :
HTML از برچسب <a> برای ساخت یک پیوند به پروندههای دیگر استفاده میکند. یک anchor میتواند به هر منبعی در وب اشاره کند.
دستورالعمل:
<source lang="php">
/* (...) */
<a href="url"> متن مورد نظر </a>
/* (...) */
</source>
موجودیت Target
با موجودیت هدف شما میتوانید معرفی کنید که پروندههای پیوند داده شده کجا باز شوند. خط زیر پروندهای را در یک پنجره مرورگر جدید باز خواهد کرد.
دستورالعمل:
<source lang="php">
/* (...) */
<a href="url" target="_blank"> متن مورد نظر </a>
/* (...) */
</source>
توجه داشته باشید بسته به نیاز شما مقدار blank_ تغییر میکند و ممکن است new_ باشد.
سرتیترها در جداول
سرتیترها در یک جدول با برچسب <th> مشخص میشوند.
لیستهای نامرتب
یک لیست نامرتب ، لیستی از اقلام است.اقلام لیست بوسیله گلوله نشانه گذاری میشوند (معمولا یک دایره سیاه کوچک). یک لیست نامرتب با یک برچسب <ul> آغاز میشوند. هر کدام از اقلام لیست با برچسب <li> آغاز میشوند.
لیستهای مرتب
یک لیست مرتب شده نیز لیستی از اقلام است. اقلام لیست بوسیله شماره نشانه گذاری میشوند.یک لیست مرتب با برچسب <ol> آغاز میشود.هرکدام از اقلام لیست با برچسب <li> آغاز میشوند.
فرمها
یک فرم ، منطقهای حاوی عناصر فرم است.عناصر فرم ، عناصری هستند که به کاربر اجازه میدهند تا اطلاعات را (مثل فیلدهای متنی ، فیلدهای text area ، لیست های پایین افتان، دکمه های رادیویی ، چک باکسها و...) در فرم وارد کند.یک فرم با برچسب <form> معرفی میشود.
در برچسب <form> برچسب <input> بیشترین استفاده را دارد.نوع ورودی با خواص آن تعیین میشود.
مثال
<source lang="php">
/* (...) */
<input type="text" name="firstname" >
/* (...) */
</source>
دکمههای رادیویی
<source lang="php">
/* (...) */
<input type="radio" name="city" value="Tehran" > Tehran </form>
/* (...) */
</source>
چک باکسها
<source lang="php">
/* (...) */
<input type="checkbox" name="Text">
/* (...) */
</source>
دکمه ارسال فرم
<source lang="php">
/* (...) */
<input type="submit" value="Send">
/* (...) */
</source>
برچسب Images و موجودیت Src
در HTML عکسها با برچسب <img > معرفی میشوند.برچسب <img > خالی است بدین معنا که آن فقط حاوی موجودیتها است و برچسب پایانی ندارد.
برای نمایش یک تصویر در یک صفحه، شما احتیاج دارید که از موجودیت Src استفاده کنید. Src مخفف source (منبع) است. محتوای موجودیت url ، Src تصویری است که شما می خواهید در صفحه تان نمایش دهید. نحوه معرفی یک تصویر به صورت زیر است :
<source lang="php">
/* (...) */
<img src="url">
/* (...) */
</source>
url به محلی اشاره میکند که تصویر در آنجا قرار دارد . تصویری که "pic.gif" نامیده شده در دایرکتوری "images" در "www.yoursite" دارای این url است:
http://yoursite/images/pic.gif
مرورگر تصویر را جایی قرار میدهد که برچسب تصویر پرونده در آنجا قرار گرفته است.اگر شما برچسب تصویر را بین دو پاراگراف قرار دهید ، مرورگر ابتدا پاراگراف اول ، سپس تصویر و سپس پاراگراف دوم را نشان می دهد.
موجودیت Alt
برای معرفی متن جایگزین به جای یک تصویر استفاده می شود. محتوای موجودیت Alt یک متن توصیفی است:
<source lang="php">
/* (...) */
<img src="url" alt="My Picture">
/* (...) */
</source>
اگر مرورگر نتواند تصویری را بارگیری نماید ، موجودیت alt به خواننده میگوید که آن را در صفحه از دست داده است ، سپس مرورگر متن جایگزین را بجای آن نشان خواهد داد.
این مقاله برای درک بهتر مفاهیم html میباشد و جنبه آموزشی ندارد. برای آموزش این برنامه نویسی و درک بهتر مفاهیم مطرح شده، به سایت http://www.html.ir مراجعه کنید و این کدنویسی را همراه با مثال و مطالب گستردهتری فرا بگیرید.
منبع : سایت html.ir
 استفاده از مطالب دانشنامه جوملا فارسی - مامبو فارسی با ذکر منبع ( دانشنامه جوملا فارسی ) و لینک مستقیم به http://docs.joomlafarsi.com بلامانع است.
|
استفاده از مطالب دانشنامه جوملا فارسی - مامبو فارسی با ذکر منبع ( دانشنامه جوملا فارسی ) و لینک مستقیم به http://docs.joomlafarsi.com بلامانع است.
