آموزش html
تگ meter در HTML
مثال (تگ meter در HTML)
استفاده از عنصر meter برای اندازه گیری داده ها در یک محدوده داده (یک مقیاس):
<meter value="2" min="0" max="10">2 out of 10</meter><br>
<meter value="0.6">60%</meter>
خودتان امتحان کنید »تعریف و کاربرد تگ meter در HTML
تگ <meter> اندازه گیری عددی یا مقدار کسری را در محدوده شناخته شده تعریف می کند. تگ <meter> به عنوان مقیاس نیز شناخته شده است.
مثال: نحوه استفاده از دیسک، ارتباط از نتیجه جستجو و غیره.
نکته: از تگ <meter> نباید برای نشان دادن یک جریان (مانند نوار پیشرفت) استفاده کرد. برای نشان دادن نوار پیشرفت می توانید از تگ <progress> استفاده کنید.
پشتیبانی مرورگرها از تگ meter در HTML
اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.
عنصر <meter> 8.0 پشتیبانی نمی شود 6.0 6.0 11.0 تفاوت بین HTML 4.01 و HTML5
تگ <meter> یک تگ جدید در HTML5 است.
خصوصیت ها
= جدید در HTML5.
خصوصیت مقدار توضیحات form form_id یک یه چند فرم که عنصر<meter> به آنها تعلق دارد را مشخص می کند. high number رنجی که به عنوان مقدار high (زیاد) مطرح شده است را مشخص می کند. low number رنجی که به عنوان یک مقدار کم مطرح شده است را مشخص می کند. max number رنجی برای مشخص کردن مقدار maximum min number رنجی برای مشخص کردن مقدار minimum optimum number مشخص می کند که برای اندازه گیری چه مقداری بهینه است. value number الزامی است. مقدار رایج اندازه گیری را مشخص می کند. ویژگی های عمومی تگ meter در HTML
تگ <meter> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ meter در HTML
تگ <meter> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ meter در JavaScript
تگ nav در HTML
مثال (تگ nav در HTML)
مجموعه ای از لینک های ناوبری:
<nav>
<a href="/html/">HTML</a> |
<a href="/css/">CSS</a> |
<a href="/js/">JavaScript</a> |
<a href="/jquery/">jQuery</a>
</nav>
خودتان امتحان کنید »تعریف و کاربرد تگ nav در HTML
تگ <nav> مجموعه ای از لینک های ناوبری را تعریف می کند.
لازم نیست تمام لینک های صفحه را در تگ <nav> قرار داد. در تگ <nav> فقط لینک های ناوبری اصلی در نظر گرفته می شود.
در مرورگرهای با قابلیت screen reader که برای افراد ناتوان ایجاد شده اند می توان مشخص کرد که محتوای عناصری مثل nav مورد بررسی قرار بگیرد یا اینکه قلم گرفته شوند.
برای آشنایی بیشتر با screen reader به لینک روبرو مراجعه فرمایید: Screen Reader
پشتیبانی مرورگرها از تگ nav در HTML
اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.
عنصر <nav> 6.0 9.0 4.0 5.0 11.1 تفاوت بین HTML 4.01 و HTML5
تگ <nav> یک تگ جدید در HTML5 است.
ویژگی های عمومی تگ nav در HTML
تگ <nav> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ nav در HTML
تگ <nav> از رویدادهای عمومی در HTML پشتیبانی می کند.
تگ noframes در HTML
مثال (تگ noframes در HTML)
یک صفحه با سه قاب با استفاده از تگ <noframes>:
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
<noframes>Sorry, your browser does not handle frames!</noframes>
</frameset>
</html>
خودتان امتحان کنید »تعریف و کاربرد تگ noframes در HTML
تگ <noframes> در HTML5 پشتیبانی نمی شود.
تگ <noframes> یک جایگزین برای مرورگرهایی است که از تگ <frame> پشتیبانی نمی کنند. تگ <noframes>می تواند تمامی عناصری که به صورت نرمال در عنصر <body> در صفحه HTML قرار می گیرد را شامل شود.
تگ <noframes> را می توان برای لینک کردن به یک نسخه بدون فرم از وب سایت و یا برای نمایش یک پیام به کاربران که اطلاع دهد چه فریم هایی مورد نیاز است، استفاده کرد.
تگ <noframes> داخل عنصر <frameset> قرار می گیرد.
نکته: اگر می خواهید یک صفحه حاوی frames، را Validate (اعتبار) کنید لازم است که <DOCTYPE> به یکی از دو حالت "HTML Frameset DTD" یا "XHTML Frameset DTD" تنظیم شده باشد.
پشتیبانی مرورگرها از تگ noframes در HTML
عنصر <noframes> بله بله بله بله بله تفاوت بین HTML 4.01 و HTML5
تگ <noframes> در HTML5 پشتیبانی نمی شود.
تفاوت بین HTML aو XHTML
نکته مهم: در XHTML Frameset DTD، متن داخل عنصر <noframes> باید داخل عنصر <body> محصور شود.
تگ noscript در HTML
مثال (تگ noscript در HTML)
استفاده از تگ <noscript>:
<script>
document.write("Hello World!")
</script>
<noscript>Your browser does not support JavaScript!</noscript>
خودتان امتحان کنید »تعریف و کاربرد تگ noscript در HTML
تگ <noscript> برای کاربرانی که script مرورگر خود را غیر فعال کرده اند و یا برای مرورگر هایی که script را پشتیبانی نمی کنند، متنی جایگزین تعریف می کند.
تگ <noscript> می تواند داخل هر دو تگ <head> و <body> قرار گیرد.
تگ <noscript> هنگامی که داخل عنصر <head> قرار می گیرد: باید شامل عناصر <link> ،<style> و <meta> باشد.
محتوای عنصر <noscript> تنها زمانی نشان داده می شود که script پشتیبانی نشود یا در مرورگر کاربر غیر فعال باشد.
پشتیبانی مرورگرها از تگ noscript در HTML
عنصر <noscript> بله بله بله بله بله نکته ها و ترفندها
نکته: یگ روش دیگر استفاده از تگ comment (توضیحات) برای مخفی و غیر فعال کردن اسکریپت ها در سمت سرویس دهنده، در مرورگرهایی که آن را پشتیبانی نمی کنند. (به طوری که آنها به صورت متن ساده نمایش داده نمی شود ):
<script>
<!--
function displayMsg()
{
alert("Hello World!")
}
//-->
</script>تفاوت بین HTML 4.01 و HTML5
در HTML 4.01، تگ <noscript> تنها می تواند در داخل عنصر <body> قرار گیرد.
در HTML5، تگ <noscript> می تواند داخل هر دو تگ <head> و <body> قرار گیرد.
تفاوت بین HTML و XHTML
در XHTML، تگ <noscript> پشتیبانی نمی شود.
ویژگی های عمومی تگ noscript در HTML
تگ <noscript> از ویژگی های عمومی در HTMLپشتیبانی می کند.
آموزش های مرتبط
تگ object در HTML
مثال (تگ object در HTML)
چگونگی استفاده از تگ <object> برای جاسازی Flash file:
<object width="400" height="400" data="helloworld.swf"></object>
خودتان امتحان کنید »تعریف و کاربرد تگ object در HTML
تگ <object> یک شیء جاسازی شده در یک سند HTML را تعریف می کند. از این عنصر به عنوان جاسازی عناصر چند رسانه ای (مانند صوت، تصویر، اپلتهای جاوا، اکتیو ایکس، PDF، و فلش) در صفحه وب خود استفاده کنید.
شما همچنین می توانید از تگ <object> برای جاسازی صفحه وب دیگر، به سند HTMLخود استفاده کنید.
شما می توانید از تگ <param> برای تصویب پلاگین هایی که به وسیله تگ <object> جاساز شده اند استفاده کنید.
پشتیبانی مرورگرها از تگ object در HTML
عنصر <object> بله بله بله بله بله نکته ها و ترفندها
نکته: یک عنصر <object> باید داخل عنصر <body> قرار گیرد. متن موجود بین دو تگ <object> و </object> متنی جایگزین، برای مرورگر هایی که این تگ را پشتیبانی نمی کنند.
نکته:برای تصاویر به جای تگ <object> از تگ <img> استفاده می کنیم.
نکته: حداقل یکی از خصوصیات "data" یا "type" باید تعریف شود.
تفاوت بین HTML 4.01 و HTML5
بعضی از خصوصیت ها موجود در HTML 4.01، در HTML5 پشتیبانی نمی شود.
خصوصیت "form" در HTML5 جدید است.
در HTML5، عناصر object را در داخل فرم ها می توان درج و استفاده کرد.
در HTML5، عنصر objects دیگر نمی تواند داخل عنصر <head> از یک سند قرار گیرد.
خصوصیت ها
= جدید در HTML5.
خصوصیت مقدار توضیحات align top
bottom
middle
left
rightدر HTML5 پشتیبانی نمی شود.
تراز بندی عنصر <object> نسبت به عناصر اطراف را مشخص می کند.archive URL در HTML5 پشتیبانی نمی شود.
فضایی که لیستی از URL را برای بایگانی جدا می کند. بایگانی منابع مربوط به object است.border pixels در HTML5 پشتیبانی نمی شود.
پهنای border اطراف عنصر <object> را مشخص می کند.classid class_ID در HTML5 پشتیبانی نمی شود.
مشخص کننده مقدار Class ID برای شی مورد نظر، که در تنظیمات رجیستری ویندوز و یا در یک URL قرار گیرد.codebase URL در HTML5 پشتیبانی نمی شود.
مشخص می کند که code عنصر object کجا یافت می شود.codetype media_type در HTML5 پشتیبانی نمی شود.
نوع media برای کدی که اشاره به صفت classid دارد را مشخص می کند.data URL مشخص کننده URL منابعی که برای object مورد استفاده قرار می گیرد. declare declare در HTML5 پشتیبانی نمی شود.
مشخص می کند که object فقط باید معرفی شود و تا زمانی که نیاز نیست ایجاد یا نصب نشود.form form_id مشخص کننده یک یا بیشتر فرم هایی که object متعلق به آنهاست. height pixels ارتفاع عنصر object را مشخص می کند. hspace pixels در HTML5 پشتیبانی نمی شود.
فضای خالی چپ و راست عنصر object را مشخص می کند.name name یک name برای عنصر object مشخص می کند. standby text در HTML5 پشتیبانی نمی شود.
مشخص کننده متنی که هنگام لود شدن object نمایش داده می شود.type media_type نوع media داده که در صفت data مشخص شده را تعریف می کند. usemap #mapname مشخص کننده name برای نقشه تصویری سمت کاربر که با object مورد استفاده قرار می گیرد. vspace pixels در HTML5 پشتیبانی نمی شود.
فضای خالی بالا و پایین عنصر object را مشخص می کند.width pixels عرض عنصر object را مشخص می کند. ویژگی های عمومی تگ object در HTML
تگ <object> از ویژگی های عمومی در HTML پشتیبانی می کند.
رویدادهای عمومی تگ object در HTML
تگ <object> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ object در JavaScript
تگ ol در HTML
مثال (تگ ol در HTML)
دو لیست مرتب متفاوت:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
خودتان امتحان کنید »تعریف و کاربرد تگ ol در HTML
تگ <ol> یک لیست مرتب را تعریف می کند. که آن لیست می تواند بر حسب عددی یا الفبایی مرتب شود.
از تگ <li> برای آیتم های لیست استفاده می کنیم.
.
پشتیبانی مرورگرها از تگ ol در HTML
عنصر <ol> بله بله بله بله بله نکته ها و ترفندها
نکته: برای لیست های نامرتب از تگ <ul> استفاده می کنیم.
نکته: برای استایل دادن به لیست ها از CSS استفاده می کنیم.
تفاوت بین HTML 4.01 و HTML5
استفاده از خصوصیت های "start" و "type" در HTML 4.01 توصیه نمی شود، اما در HTML5 پشتیبانی می شود.
خصوصیت "reversed" در HTML5 جدید است.
خصوصیت "compact" در HTML5 پشتیبانی نمی شود.
خصوصیت ها
= جدید در HTML5.
خصوصیت مقدار توضیحات compact compact در HTML5 پشتیبانی نمی شود.
مشخص می کند که لیست باید کوچکتر از حد نرمال نمایش داده شود.reversed reversed مشخص می کند که لیست به صورت نزولی مرتب شود.(9 و 8 و 7 و...) start number مقدار شروع لیست مرتب را مشخص می کند. type 1
A
a
I
iمشخص می کند که از چه نوع نشانگری در لیست استفاده شود. ویژگی های عمومی تگ ol در HTML
تگ <ol> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ ol در HTML
تگ <ol> از رویدادهای عمومی در HTMLپشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ ol در JavaScript
تگ optgroup در HTML
مثال (تگ optgroup در HTML)
گروه بندی گزینه های مرتبط با استفاده از تگ <optgroup> :
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
خودتان امتحان کنید »تعریف و کاربرد تگ optgroup در HTML
تگ <optgroup> برای گروه بندی option های (گزینه ها) مرتبط در یک لیست کشویی استفاده می شود.
اگر شما دارای یک لیست طولانی از گزینه ها می باشید استفاده از تگ optgroup برای کنترل کردن گزینه ها مرتبط راحت تر است و مورد پسند کاربر نیز می باشد.
پشتیبانی مرورگرها از تگ optgroup در HTML
عنصر <optgroup> بله بله بله بله بله تفاوت بین HTML 4.01 و HTML5
تفاوتی وجود ندارد.
خصوصیت ها
خصوصیت مقدار توضیحات disabled disabled مشخص می کند که option-group باید غیر فعال شود. label text یک برچسب برای option-group مشخص می کند. ویژگی های عمومی تگ optgroup در HTML
تگ <optgroup> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ optgroup در HTML
تگ <optgroup> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ optgroup در JavaScript
تگ option در HTML
مثال (تگ option در HTML)
یک لیست کشویی با چهار گزینه:
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
خودتان امتحان کنید »تعریف و کاربرد تگ option در HTML
تگ <option> یک گزینه برای لیست انتخاب تعریف می کند.
<option> داخل عنصر <select> یا عنصر <datalist> قرار می گیرد.
پشتیبانی مرورگرها از تگ option در HTML
عنصر <option> بله بله بله بله بله نکته ها و ترفندها
نکته: تگ <option> می تواند بدون به کار بردن هیچ یک از خصوصیات بکار رود، اما شما معمولا به خصوصیت value برای اینکه مشخص کند چه چیزی به سرور ارسال شود نیاز دارید.
نکته: اگر شما یک لیست طولانی از گزینه ها داشته باشید می توانید، گزینه های مرتبط را به وسیله تگ <optgroup> گروه بندی کنید.
خصوصیت ها
خصوصیت مقدار توضیحات disabled disabled مشخص می کند که option باید غیر فعال شود. label text یک برچسب کوتاه برای option مشخص می کند. selected selected مشخص می کند هنگامی که صفحه لود می شود option ها به طور پیش فرض انتخاب شده باشد. value text مشخص می کند که چه مقدار به سرور ارسال شود. ویژگی های عمومی تگ option در HTML
تگ <option> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ option در HTML
تگ <option> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ option در JavaScript
تگ output در HTML
مثال (تگ output در HTML)
انجام محاسبات و نشان دهنده نتیجه در عنصر <output> :
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>
خودتان امتحان کنید »تعریف و کاربرد تگ output در HTML
تگ <output> نشان دهنده نتیجه یک محاسبه است. (مانند نتیجه محاسبات انجام شده توسط یک اسکریپت)
پشتیبانی مرورگرها از تگ output در HTML
اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.
عنصر <output> 10.0 پشتیبانی نمی شود 4.0 5.1 11.0 تفاوت بین HTML 4.01 و HTML5
تگ <output> یک تگ جدید در HTML5 است.
خصوصیت ها
= جدید در HTML5.
خصوصیت مقدار توضیحات for element_id رابطه بین نتیجه برای محاسبات وعنصر استفاده شده در محاسبات را مشخص می کند. form form_id مشخص کننده فرم یا فرم هایی است که عنصر output متعلق به آنهاست. name name یک name برای عنصر output مشخص می کند. ویژگی های عمومی تگ output در HTML
تگ <output> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ output در HTML
تگ <output> از رویدادهای عمومی در HTML پشتیبانی می کند.
تگ q در HTML
مثال (تگ q در HTML)
یک نقل قول کوتاه:
<p>WWF's goal is to:
<q>Build a future where people live in harmony with nature.</q>
We hope they succeed.</p>
خودتان امتحان کنید »تعریف و کاربرد تگ q در HTML
تگ <q> یک نقل قول کوتاه را تعریف می کند.
مرورگرها معمولا علامت نقل قول را در اطراف نقل قول درج می کنند.
پشتیبانی مرورگرها از تگ q در HTML
عنصر <q> بله بله بله بله بله نکته ها و ترفندها
نکته: از عنصر <blockquote> برای نشانه گذاری یک بخش استفاده می شود که به نقل از منبع دیگری است.
تفاوت بین HTML 4.01 و HTML5
تفاوتی وجود ندارد.
خصوصیت ها
خصوصیت مقدار توضیحات cite URL آدرس منبع نقل قول را مشخص می کند. ویژگی های عمومی تگ q در HTML
تگ <q> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ q در HTML
تگ <q> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ q در JavaScript
تگ rp در HTML
مثال (تگ rp در HTML)
حاشیه نویسی ruby :
<ruby>
漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt>
</ruby>
خودتان امتحان کنید »تعریف و کاربرد تگ rp در HTML
تگ <rp> تعریف می کند که چه چیزی نشان داده شود، اگر مرورگر از حاشیه نویسی ruby پشتیبانی نکند.
حاشیه نویسی ruby برای نمایش تلفظ کاراکترهای زبان های آسیای شرقی کاربرد دارد.
تگ <rp> همراه با تگ <ruby> و تگ <rt> استفاده می شود: تگ <ruby> شامل یک یا چند کاراکتر است که نیاز به تفسیر یا تلفظ صحیح کارکترها دارد، و تگ <rt> برای دادن اطلاعات و اختیار به تگ <rp> که چه چیزی نشان داده شود، هنگامی که مرورگر از حاشیه نویسی ruby پشتیبانی نکند.
پشتیبانی مرورگرها از تگ rp در HTML
اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.
عنصر <rp> 5.0 5.5 38.0 5.0 15.0 تفاوت بین HTML 4.01 و HTML5
تگ <rp> یک تگ جدید در HTML5 است.
ویژگی های عمومی تگ rp در HTML
تگ <rp> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ rp در HTML
تگ <rp> از رویدادهای عمومی در HTML پشتیبانی می کند.
تگ s در HTML
مثال (تگ s در HTML)
متن به صورت خط خورده:
<p><s>My car is blue.</s></p>
<p>My new car is silver.</p>
خودتان امتحان کنید »تعریف و کاربرد تگ s در HTML
تگ <s> مشخص می کند که متن درست، دقیق و مناسب نیست.
از تگ <s> برای متن جایگزین یا حذف شده نباید استفاده کرد، می توانیم به جای آن از تگ <del> استفاده کنیم .
پشتیبانی مرورگرها از تگ s در HTML
عنصر <s> بله بله بله بله بله تفاوت بین HTML 4.01 و HTML5
عنصر <s> در HTML 4.01، متن را به صورت خط خورده نمایش می دهد و استفاده از آن هم توصیه نمی شود.
عنصر <s> در HTML5، مشخص می کند که متن درست، دقیق و مناسب نیست.
ویژگی های عمومی تگ s در HTML
تگ <s> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ s در HTML
تگ <s> از رویدادهای عمومی در HTML پشتیبانی می کند.
تگ script در HTML
مثال (تگ script در HTML)
script زیر عبارت Hello World را چاپ می کند:
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
خودتان امتحان کنید »تعریف و کاربرد تگ script در HTML
تگ <script> برای برنامه نویسی سمت کاربر استفاده می شود، مثل JavaScript
عنصر <script> به دو صورت استفاده می شود یا با نوشتن دستورات درون تگ script یا به صورت یک فایل script خارجی که با خصوصیت src مشخص می شود.
کاربردهای رایج برای JavaScript: دستکاری تصویر، اعتبار سنجی فرم و تغییرات محتوا بصورت پویا می باشد.
پشتیبانی مرورگرها از تگ script در HTML
عنصر <script> بله بله بله بله بله نکته ها و ترفندها
نکته: اگر از خصوصیت "src" استفاده کنیم , عنصر <script> باید خالی باشد.
نکته: همچنین عنصر <noscript> زمانی استفاده می شود که script ها در مرورگر غیر فعال شده یا مرورگری است که script سمت کاربر را پشتیبانی نمی کنند.
نکته: راه های مختلف برای اجرا شدن script خارجی:
- اگر خصوصیت "async="async باشد: اسکریپت غیر همزمان با بقیه از صفحه اجرا می شود (زمانی کی که اسکریپت شما به سایر اسکریپت ها وابستگی نداشته باشد).
- اگر خصوصیت async ارائه نشود و خصوصیت "defer="defer باشد: اسکریپت پس از بازگذاری کامل صفحه اجرا می شود و تمام دستورات نیز در آخرین مرحله اجرا می شوند.
- اگر async یا defer هیچکدام ارائه نشوند: اسکریپت بلافاصله اجرا می شود قبل از اینکه مرورگر به بارگذاری آن صفحه ادامه دهد.
تفاوت بین HTML 4.01 و HTML5
خصوصیت "type" در HTML 4 الزامی است، اما در HTML5 اختیاری است.
خصوصیت "async" در HTML5 جدید است.
خصوصیت "xml:space" موجود در HTML 4.01، در HTML5 پشتیبانی نمی شود.
تفاوت بین HTMLوXHTML
در XHTML، محتویات درون اسکریپت به عنوان PCDATA# (به جای CDATA) اعلام می شود، بدان معنی است که موجودیت تجزیه خواهد شد.
این به این معنی است که در XHTML، تمام کاراکترهای خاص باید کد گذاری شود، یا تمام مطالب باید در داخل یک بخش CDATA پنهان شود:
<script type="text/javascript">
//<![CDATA[
var i = 10;
if (i < 5) {
// some code
}
//]]>
</script>خصوصیت ها
= جدید در HTML5.
خصوصیت مقدار توضیحات async async مشخص می کند که اسکریپت غیر همزمان با بقیه از صفحه اجرا می شود. (فقط برای اسکریپت خارجی) charset charset نحوه کد گذاری کاراکترها را در اسکریپت مشخص می کند. defer defer مشخص می کند که اسکریپت پس از بازگذاری کامل صفحه اجرا می شود. (فقط برای اسکریپت خارجی) src URL مسیر کامل فایلی که دستورات اسکریپت در آن قرار دارد را مشخص می کند. type media_type نوع اسکریپت را مشخص می کند. xml:space preserve در HTML5 پشتیبانی نمی شود.
مشخص می کند که whitespace در کد باید حفظ شود.ویژگی های عمومی تگ script در HTML
تگ <script> از ویژگی های عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ script در JavaScript
تگ small در HTML
مثال (تگ small در HTML)
نمایش یک متن کوچکتر:
<p>W3Schools.com - the world's largest web development site.</p>
<p><small>Copyright 1999-2050 by Refsnes Data</small></p>
خودتان امتحان کنید »تعریف و کاربرد تگ small در HTML
تگ <small> متن درونش را یک واحد کوچکتر از متون اطرافش مشخص می کند.
پشتیبانی مرورگرها از تگ small در HTML
عنصر <small> بله بله بله بله بله تفاوت بین HTML 4.01 و HTML5
تفاوتی وجود ندارد.
ویژگی های عمومی تگ small در HTML
تگ <small> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ small در HTML
تگ <small> از رویدادهای عمومی در HTML پشتیبانی می کند.
تگ span در HTML
مثال (تگ span در HTML)
استفاده از عنصر span برای متمایز کردن رنگ قسمتی از متن:
<p>My mother has <span style="color:blue">blue</span> eyes.</p>
خودتان امتحان کنید »تعریف و کاربرد تگ span در HTML
تگ <span> یک عنصر درون خطی (inline) در سند است.
تگ <span> بدون تغییرات بصری هیچ چیز در صفحه نشان نمی دهند.
تگ <span> راهی را برای اضافه کردن قالب به بخشی از یک متن و یا بخشی از یک سند فراهم می کند.
پشتیبانی مرورگرها از تگ span در HTML
عنصر <span> بله بله بله بله بله نکته ها و ترفندها
نکته: هنگامی که شما از تگ <span> استفاده می کنید، می توانید از ویژگی های CSSیا JavaScriptبرای این تگ استفاده کنید.
تفاوت بین HTML 4.01 و HTML5
تفاوتی وجود ندارد.
ویژگی های عمومی تگ span در HTML
تگ <span> از ویژگی های عمومی در HTML پشتیبانی می کند.
رویدادهای عمومی تگ span در HTML
تگ <span> از رویدادهای عمومی در HTML پشتیبانی می کند.
آموزش های مرتبط
مرجع اشیاء اچ تی ام ال: تگ span در JavaScript
تگ strike در HTML
مثال (تگ strike در HTML)
مشخص کردن یک متن خط خورده به شرح زیر:
<p>Version 2.0 is <strike>not yet available!</strike> now available!</p>
خودتان امتحان کنید »هتعریف و کاربرد تگ strike در HTML
تگ <strike> در HTML5 پشتیبانی نمی شود. شما می توانید به جای آن از تگ <del> استفاده کنید.
تگ <strike> یک متن خط خورده را تعریف می کند.
پشتیبانی مرورگرها از تگ strike در HTML
عنصر <strike> بله بله بله بله بله
تگ sup در HTML
مثال (تگ sup در HTML)
متن بالانویس:
<p>This text contains <sup>superscript</sup> text.</p>
خودتان امتحان کنید »تعریف و کاربرد تگ sup در HTML
تگ <sup> متن را به صورت بالانویس تعریف می کند. بالا نویس ها معمولا به اندازه ی نصف ارتفاع یک کاراکتر بالاتر از بقیه ی کاراکتر قرار می گیرند و گاهی اوقات در یک فونت کوچکتر ارائه می شوند. بالانویس می تواند برای پانوشت استفاده شود، مانند: WWW[1].
نکته: از تگ <sub> برای تعریف متن به صورت زیر نویس استفاده می کنیم.
پشتیبانی مرورگرها از تگ sup در HTML
عنصر <sup> بله بله بله بله بله تفاوت بین HTML 4.01 و HTML5
تفاوتی وجود ندارد.
ویژگی های عمومی تگ sup در HTML
تگ <sup> از ویژگی های عمومی در HTMLپشتیبانی می کند.
رویدادهای عمومی تگ sup در HTML
تگ <sup> از رویدادهای عمومی در HTML پشتیبانی می کند.
توضیحات در HTML
مثال (توضیحات در HTML)
توضیحات در HTML:
<!--This is a comment. Comments are not displayed in the browser-->
<p>This is a paragraph.</p>
خودتان امتحان کنید »تعریف و کاربرد
جهت قراردادن توضیحات برای اسکریپت ها در صفحه HTML( اچ تی ام ال) از این دستور استفاده می شود . این توضیحات در صفحه ی مرورگر نمایش داده نمی شود. شما می توانید از توضیحات برای تشریح کدهای خود استفاده کنید. توضیحات به شما کمک می کند کدها را در آینده آسانتر ویرایش کنید. این توضیحات به ویژه زمانی مفید است که تعداد کدهای شما زیاد باشد.
پشتیبانی مرورگرها
عنصر <!--...--> بله بله بله بله بله تفاوت بین HTML4.01 و HTML5
تفاوتی وجود ندارد.
نکته ها وترفندها
نکته: از تگ<--...--!> (توضیحات) می توان برای مخفی و غیر فعال کردن اسکریپت ها در مرورگرهایی که آن را پشتیبانی نمی کنند استفاده کرد.
<script type="text/javascript">
< !--
function displayMsg()
{
alert("Hello World!")
}
//-->
< /script>نکته:برای کامنت کردن کدهای جاوااسکریپت و به منظور جلوگیری از اجرای آن، در انتهای کامنت، از دو اسلش رو به جلو ( // ) استفاده می کنیم.
Standard خصوصیت ها
تگ <--..--!> (توضیحات) هیچ یک از ویژگی های استانداردها را پشتیبانی نمی کند.
مطالعه بیشتر در مورد: مرجع HTML-خصوصیت های عمومی
رویدادهای عمومی
تگ <--..--!> (توضیحات) هیچ یک از ویژگی های رویداد را پشتیبانی نمی کند.
مطالعه بیشتر در مورد: مرجع HTML-رویدادهای عمومی
جداول در HTML
جداول در HTML
کالری نام میوه 44% سیب 23% موز 13% پرتقال 10% دیگر موارد Tables
نحوه ایجاد جداول در سند HTML.Table borders
چگونه لبه های جدول را تنظیم کنیم.(مثال های بیشتر را می توانید در پایین صفحه ببینید.)
جداول در HTML
جداول به وسیله تگ <table> تعریف می شوند.
یک جدول حاوی سطرهایی می باشد (که با تگ <tr> مشخص می شوند) و هر سطر شامل تعدادی سلول است (که با تگ <td> مشخص می شوند)
td مخفف "table data" است و حاوی داده های سلول ها می باشد. تگ <td> می تواند حاوی متن، لینک، تصویر، لیست ها، فرم ها، جداول دیگر و غیره باشد.
<table>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>کد HTML بالا چگونه در یک مرورگر دیده می شود:
row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 خصوصیت Border
اگر شما خصوصیت Border را برای جدولی مشخص نکنید، جدول بدون لبه نمایش داده می شود. گاهی اوقات این مورد می تواند کاربردی باشد، اما بیشتر مواقع ما نیاز به نمایش لبه ها داریم.
برای نمایش لبه ها باید خصوصیت Border را تنظیم کنیم.
مثال (جداول در HTML)
<table border="1" style="width:300px">
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
خودتان امتحان کنید »توجه داشته باشید که اگر بخواهید طبق استاندارهای HTML پیش بروید نباید از ویژگی border استفاده کنید.
برای تنظیم لبه ها بهتر است از CSSها استفاده کنید.با استفاده از خصوصیت border در CSS می توانید لبه ها را تنظیم نمایید:
بیاد داشته باشید که لبه ها برای دور جدول و تمام سلول های جدول، تنظیم خواهد شد.
تبدیل لبه های دو خطی به یک خطی
با استفاده از خصوصیت border-collapse در CSS می توانید، لبه های دوخطی جدول را به لبه های یک خطی تبدیل کنید:
مثال (جداول در HTML)
<style>
table,th,td
{
border:1px solid black;
border-collapse:collapse
}
</style>
خودتان امتحان کنید »تنظیم فاصله ی محتوای سلول ها از لبه
با استفاده از خصوصیت padding در CSS می توانید فاصله محتویات یک سلول را از لبه هایش تنظیم کنید.
اگر این خصوصیت را تنظیم نکنید، فاصله محتوی تا لبه، صفر در نظر گرفته می شود.
تنظیم فاصله سلول ها از یکدیگر
با استفاده از خصوصیت border-spacing در CSS می توانید فاصله سلول ها از یکدیگر را تنظیم کنید.
عنوان جدول (Header)
اطلاعات سرتیتر در یک جدول به وسیله تگ <th> تعریف می شود.
بیشتر مرورگرها متن را در عنصر <th> به صورت برجسته (bold) و وسط چین نمایش می دهند.
مثال (جداول در HTML)
<table style="width:300px">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Points</th>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
خودتان امتحان کنید »با استفاده از خصوصیت text-align در CSS، می توانیم سرتیترهای جدول بالا را در سمت چپ تنظیم کنیم:
Tables without borders
چگونه جدولی بدون خطوط حاشیه (Border) ایجاد کنیم.Table headers
نحوه ایجاد سرتیترهای جدول.Table with a caption
نحوه اضافه کردن عنوان به یک جدول.Table cells that span more than one row/column
چگونگی تعریف سلول های جدول که بیش از یک سطر یا بیش از یک ستون را شامل می شوند.Tags inside a table
نحوه نمایش عناصر درون عناصر دیگر.Cell padding
چگونه از cellpadding برای ایجاد فاصله بیشتر بین محتوای سلول با حاشیه سلول استفاده کنیم.Cell spacing
چگونه از cellspacing برای افزایش فاصله بین سلول ها استفاده کنیم.The frame attribute
چگونه از خصوصیت "frame" برای کنترل حاشیه های دور جدول استفاده کنیم.تگ های جدول در HTML
Tag توضیحات <table> تعریف جدول <th> تعریف عنوان جدول (table header) <tr> تعریف سطر جدول (table row) <td> تعریف سلول جدول (table data) <caption> تعریف تیتر جدول (table caption) <colgroup> برای فرمت دهی یک یا تعدادی از ستون ها کاربرد دارد <col> برای فرمت دهی یک یا تعدادی از ستون ها کاربرد دارد <thead> عناوین ستون های یک جدول (header) را گروه بندی می کند <tbody> محتویات بدنه یک جدول را گروه بندی می کند <tfoot> محتویات انتهای ستون های یک جدول (footer) را گروه بندی می کند چکیده مطالب HTML در یک نگاه
چکیده مطالب html در یک نگاه
خلاصه ای از مطالب ارائه شده در مورد HTML در زیر ارائه شده است. آنرا چاپ کنید، تا کنید و در مکانی امن قرار دهید.
تگ های اصلی یک سند HTML
<!DOCTYPE html>
<html>
<head>
<title>Title of document goes here</title>
</head>
<body>
Visible text goes here...
</body>
</html>تگ عنوان در HTML
<h1>Largest Heading</h1>
<h2> . . . </h2>
<h3> . . . </h3>
<h4> . . . </h4>
<h5> . . . </h5>
<h6>Smallest Heading</h6>تگ های متن در HTML
<p>This is a paragraph</p>
<br /> (line break)
<hr /> (horizontal rule)
<pre>This text is preformatted</pre>تگ های فرمت بندی متن در HTML
<em>This text is emphasized</em>
<strong>This text is strong</strong>
<code>This is some computer code</code>
<b>This text is bold</b>
<i>This text is italic</i>تگ لینک در HTML
Ordinary link:
<a href="http://www.example.com/">Link-text goes here</a>
Image-link:
<a href="http://www.example.com/"><img src="/URL" alt="Alternate Text" /></a>
Mailto link:
<a href="mailto:این آدرس ایمیل توسط spambots حفاظت می شود. برای دیدن شما نیاز به جاوا اسکریپت دارید ">Send e-mail</a>
Bookmark:
<a name="tips">Tips Section</a>
<a href="#tips">Jump to the Tips Section</a>تگ لیست های نامرتب در HTML
<ul>
<li>Item</li>
<li>Item</li>
</ul>تگ لیست های مرتب در HTML
<ol>
<li>First item</li>
<li>Second item</li>
</ol>تگ لیست های تعریفی در HTML
<dl>
<dt>First term</dt>
<dd>Definition</dd>
<dt>Next term</dt>
<dd>Definition</dd>
</dl>تگ جدول در HTML
<table border="1">
<tr>
<th>Tableheader</th>
<th>Tableheader</th>
</tr>
<tr>
<td>sometext</td>
<td>sometext</td>
</tr>
</table>تگ تصویر در HTML
<img src="/URL" alt="Alternate Text" height="42" width="42">تگ Styles در HTML
<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
<div>A block-level section in a document</div>
<span>An inline section in a document</span>تگ iframe در HTML (صفحه ای داخل صفحه جاری)
<iframe src="/demo_iframe.htm"></iframe>تگ فرم در HTML (ارسال اطلاعات به سرور)
<form action="http://www.example.com/test.asp" method="post/get">
<input type="text" name="email" size="40" maxlength="50" />
<input type="password" />
<input type="checkbox" checked="checked" />
<input type="radio" checked="checked" />
<input type="submit" value="Send" />
<input type="reset" />
<input type="hidden" />
<select>
<option>Apples</option>
<option selected="selected">Bananas</option>
<option>Cherries</option>
</select>
<textarea name="comment" rows="60" cols="20"></textarea>
</form>کاراکترهای رزرو شده در HTML
< is the same as <
> is the same as >
© is the same as ©