اچتمل برنامه نویسی 0 دیدگاه تعداد بازدید: 30

معرفی و کاربرد ویژگی خصوصی enctype در سند HTML

ویژگی خصوصی enctype ، مخصوص تگ form می باشد.
ویژگی enctype ، نحوه رمزگذاری داده های فرم برای ارسال به سرور را تعریف می کند.
صفت enctype ، معمولا زمانی به کار می رود، که داده های فرم html جهت ارسال به سرور نیاز به رمزگذاری دارد.
خاصیت enctype ، سه مقدار یا value می گیرد ، که در ادامه به توضیح مقادیر صفت enctype می پردازیم.

نکته مهم

صفت enctype تنها در صورتی که ویژگی method درون تگ form برابر با مقدار post باشد ( “method=”post ) قابل استفاده است. (بیشتر…)

ادامه مطلب
اچتمل برنامه نویسی 0 دیدگاه تعداد بازدید: 22
html

برچسب پایان را فراموش نکنید

برخی از عناصر HTML حتی اگر تگ پایان را فراموش کنید به درستی نمایش داده می شود :

 

<html>
<body>

<p>This is a paragraph
<p>This is a paragraph

</body>
</html>

مثال فوق در تمام مرورگرها کار می کند، زیرا برچسب بسته تگ <p> اختیاری است.

هرگز به آن اعتماد نکنید! اگر تگ پایان را فراموش کرده اید ممکن است نتایج غیر منتظره یا خطا ایجاد کنید.

عناصر HTML خالی

عناصر HTML بدون محتوای عناصر خالی نامیده می شوند.

<br> یک عنصر خالی بدون تگ بسته (برچسب یک خط بعد) است.

برای عناصر خالی می توان برچسب پایانی استفاده کرد: <br /> .

HTML5 نیاز ندارد عناصر خالی بسته شوند اما اگر میخواهید اعتبار دقیقتری داشته باشید یا اگر بخواهید سند خود را با تجزیه کننده XML قابل خواندن کنید، باید تمام عناصر HTML را به درستی ببندید.

از تگهای با حروف کوچک استفاده کنید

تگ های HTML حساس به حروف بزرگ نیستند: <P> به معنی همان <p> است.

استاندارد HTML5 نیازی به تگ های با حروف کوچک نیست، اما W3C توصیه به حروف کوچک در HTML را ارائه می دهد و برای انواع سند دقیق مانند XHTML خواستار حروف کوچک است.

خصیصه های HTML

خصیصه ها اطلاعات اضافی در مورد عناصر HTML ارائه می دهند.

تمام عناصر HTML می توانند دارای خصیصه باشند.
خصیصه ها اطلاعات اضافی در مورد یک عنصر ارائه می کنند.
ویژگی ها همیشه در برچسب شروع مشخص می شوند.
خصوصیات معمولا به صورت جفت “مقدار”=نام هستند.

خصیصه href

لینک های HTML با برچسب <a> تعریف شده اند. آدرس لینک در صفت href مشخص شده است:

<a href="http://eliagroup.ir">گروه ایلیا</a>
درباره پیوندها و تگ <a> در این آموزش بیشتر یاد خواهید گرفت.
خصیصه src

تصاویر HTML با برچسب <img> تعریف می شوند و نام منبع تصویر در مشخصه src مشخص شده است:

<img src="img.jpg">
ویژگی های عرض و ارتفاع

تصاویر در HTML دارای مجموعه ای از ویژگی های اندازه، که عرض و ارتفاع تصویر را مشخص می کند:

<img src="img.jpg" width="500" height="600">
خصیصه های width و height به ترتیب عرض و طول عکس را تعیین می کنند و اندازه تصویر با پیکسل مشخص می شود.
ویژگی alt

خصیصه alt یک متن جایگزین را  هنگام استفاده از یک تصویر می تواند نمایش دهد. ارزش این ویژگی توسط مرورگرها و سئو است. برای مثال فرد دچار اختلال بینایی هنگام “گوش دادن” به صفحه وب به جای تصاویر، متن جایگزین توضیح آن تصویر را می شنود. همچنین زمانی که مرورگر نمی تواند تصویر را نمایش دهد به جای آن متن جایگزین نمایش داده شود.

<img src="book.jpg" alt="کتاب آموزش اچتمل">
ادامه مطلب
اچتمل برنامه نویسی 0 دیدگاه تعداد بازدید: 26
html

پاراگراف ها در اچتمل با برچسب یا تگ <p> نمایش داده می شوند:

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
لینک ها در اچتمل با برچسب یا تگ <a> نمایش داده می شوند:
<a href="http://eliagroup.ir">This is a link</a>
سایتی که قرار است وقتی روی متن کلیک شد باز شود جلوی href  نوشته می شود. یعنی اگر This is a link را کلیک کنیم سایت باز می شود.
دکمه ها یا باتن
ساخت یک دکمه با تگ <button> انجام می شود:
<button>Click me</button>
تصاویر
تصاویر HTML با برچسب <img> تعریف می شوند.
فایل منبع (src)، متن جایگزین (alt)، عرض و ارتفاع به عنوان ویژگی ها ارائه می شود:
<img src="picture.jpg" alt="eliagroup.ir" width="104" height="142">
لیست های HTML
لیست ها با برچسب <ul> (فهرست نامرتب – unordered/bullet list) یا برچسب <ol> (فهرست مرتب – ordered/numbered list)، و سپس برچسب های <li> (آیتم های لیست) تعریف می شوند:
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

عناصر HTML

یک عنصر HTML معمولا شامل یک تگ شروع و تگ پایان است، با محتوای وارد شده بین:

<tagname> محتوا در اینجا نوشته می شود </ tagname>

عنصر HTML همه چیز را از برچسب شروع به تگ پایان می دهد:
<p> اولین پاراگراف من </ p>
عناصر HTML بدون محتوای عناصر خالی نامیده می شوند. عناصر خالی تگ پایان ندارند، مانند عنصر <br> (که نشان دهنده یک شکست خط است و به خط بعدی می رود).

عناصر HTML تو در تو

عناصر HTML را می توان تو در تو (عنصر می تواند شامل عنصر یا عناصر دیگری باشد).

همه اسناد HTML از عناصر HTML تو در تو تشکیل شده اند.

این مثال شامل چهار عنصر HTML است:

<p>This is a <strong>sentence</strong> of text 
and it also has some <em>italicized text</em> too.</p>
عنصر اصلی تگ <p> است که تگ <strong> و <em> داخل آن به صورت تو در تو نوشته شده است که به ترتیب باعث پررنگ (بولد) و کج شدن می شوند. نتیجه به صورت زیر است:
This is a sentence of text and it also has some italicized text too.
ادامه مطلب
اچتمل برنامه نویسی 0 دیدگاه تعداد بازدید: 28

ویرایشگرهای html:

۱- در ویندوز نوت پد (NotePad) و در مک تکست ادیت (TextEdit) را باز کنید.

۲- کد زیر را در آن تایپ کنید:

 

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>


۳- فایل را با نام “index.htm” یا “index.html” ذخیره کنید و encoding را به UTF-8 تغییر دهید.

۴- روی فایل ذخیره شده دو بار کلیک کنید تا نمایش داده شود.

عناصر برچسب:

برچسبها خود می توانند شامل عناصری باشند ، عناصر می توانند اطلاعات اضافی در باره عناصر HTML در صفحه شما را فراهم کنند.این برچسب عنصر بدنه را در صفحه شما معرفی می کند:

با اضافه کردن عنصر <bgcolor> به عنصر <body> شما می توانید به مرورگر بگویید که رنگ پس زمینه شما باید قرمز باشد مثل این:

 

<body bgcolor="red">


این برچسب یک جدول HTML را معرفی می کند:<table>

با اضافه کردن عنصر حاشیه شما می توانید به مرورگر بگویید که جدول نباید هیچ لبه و حاشیه ای داشته باشد:

 

<table border="0">


عناصر همیشه در یک زوج نام/مقدار می آیند، مثل این: نام=”مقدار”
عناصر همیشه به برچسب شروع عناصر HTML اضافه می شوند

 

حالتهای کتیشن ، ‘قرمز’ یا “قرمز”؟

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

Name='john "shotgun" Nelson'
ادامه مطلب
اچتمل برنامه نویسی 0 دیدگاه تعداد بازدید: 26

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

تگ های HTML

  • تگ های HTML برای نشانه گذاری عناصر HTML استفاده می شوند
  • تگ های HTML توسط دو کاراکتر < و > محاط می شوند
  • این کاراکتر های محاط کننده قلاب نامیده می شوند
  • تگ های HTML معمولا بصورت جفت می آیند <b> , <b/>
  • اولین تگ دوتایی تگ شروع و دومی تگ پایانی است.
  • متن های بین تگ ابتدایی و انتهایی محتوای عناصر هستند
  • تگ های HTML به حروف کوچک و بزرگ حساس نیستند <b> معادل <B> است.

مثال HTML در جلسه قبل را بخاطر بیاورید. این یک عنصر HTML است:

<b>This text is bold</b>

عنصر HTML با یک تگ شروع ، آغاز می شود:<b>
محتوای عنصر HTML: This text is bold
عنصر HTML با یک تگ پایانی تمام می شود:<b/>
هدف تگ <b> این است که تعریف کند عناصر HTML باید بصورت برجسته نشان داده شوند این نیز همچنین یک عنصر HTML است:

<body>
This is my first homepage.<b>This text is bold</b>
</body>

این عنصر HTML با تگ آغازین <body> شروع و با تگ پایانی <body/> تمام می شود.
هدف برچسب <body> این است که عناصر HTML را که محتوای بدنه HTML هستند تعریف کند.

بنابراین این مثال شامل دو عنصر است.

چرا ما از تگ هایی با حروف کوچک استفاده می کنیم؟

ما فقط گفتیم که برچسب های HTML حساس به حروف کوچک و بزرگ نیستند و <B>همان معنی <b>را می دهد.هنگامی که شما به وب گردی می پردازد، متوجه خواهید شد که بیشتر آموزش ها در مثال هایشان از حروف بزرگ برچسب (تگ ) های HTML استفاده می کنند.ما همیشه از برچسب های حروف کوچک استفاده می کنیم. چرا؟
اگر شما می خواهید خود را برای نسل های بعدی HTML آماده کنیدشما باید شروع کنید  و از برچسبهای حروف کوچک استفاده کنید.کنسرسیوم شبکه گسترده جهانی (W3C) در نظریه HTML4 خود برچسب های حروف کوچک را توصیه کرده و XHTML (نسل بعدی HTML) برچسبهای حروف کوچک را خواستار شده است.

برچسب های پایه HTML

مهمترین برچسب در HTML برچسب هایی هستند که سر تیتر ها ، پاراگراف ها و پرش به خط بعد را معرفی می کنند. بهترین راه یادگرفتن HTML کار کردن با مثال هاست.

ساده ترین Html

این مثال ساده ترین نمونه html است که در آن، از کمترین برچسب ممکن، استفاده شده است. در این مثال جمله نوشته شده درون برچسب body، نمایش داده می شود.

<body>
 This is my first homepage.
</body>

 سر تیتر ها

سر تیترها با برچسب های <h1> تا <h6> معرفی می شوند.<h1> بیانگر بزرگترین سرتیتر  و <h6> بیانگر کوچکترین سر تیتر است. HTML بطور خودکار فضای خالی اضافی به قبل و بعد از سر تیترها اضافه می کند.

<h1> This is a heading </h1>
<h2> This is a heading </h2>
<h3> This is a heading </h3>
<h4> This is a heading </h4>
<h5> This is a heading </h5>
<h6> This is a heading </h6>

پاراگراف ها

پاراگراف ها با برچسب <p> معرفی می شوند. HTML بطور خودکار فضای خالی اضافی به قبل و بعد از یک پاراگراف اضافه می کند.

<p> This is a paragraph </p>
<p> This is another paragraph </p>

پرش به خط بعد

برچسب <br> هنگامی استفاده می شود که بخواهیم یک خط را پایان دهیم اما نمی خواهیم یک پاراگراف جدید را آغاز کنیم. برچسب <br> شما را از هر جا که قرار دارید به یک خط پایین تر می برد. برچسب <br> یک برچسب تکی است و هیچ برچسب پایانی ندارد.

توضیحات در HTML

برچسب توضیحات برای وارد کردن توضیحات در منبع کد HTML استفاده می شود.توضیحات توسط مرورگرها نادیده گرفته می شوند. شما می توانید از توضیحات برای تشریح کد های خود استفاده کنید که می تواند به شما هنگامی که در آینده کد منبع خود را ویرایش می کنید کمک کند.

<!--This is a comment-->

توجه کنید که شما بعد از باز کردن براکت به علامت تعجب نیاز دارید اما قبل از بستن نیاز ندارید.

نکات پایه ای – اطلاعات مفید

هنگامی که شما یک متن HTML می نویسید هرگز نمی توانید مطمئن باشید این متن  در یک مرورگر دیگر چطور نشان داده می شود.تعدادی از مردم صفحه نمایش بزرگ کامپیوتر دارند و تعدادی کوچک. هر بار که کاربر اندازه پنجره را تغییر دهد متن دوباره قالب بندی خواهد شد. هرگز سعی نکنید که با اضافه کردن خطوط خالی و فاصله در متن آن را در ویرایشگرتان قالب بندی کنید.
HTML فاصله ها را از متن حذف می کند، هر تعدادی از فاصله ها تنها  به یک فاصله  تبدیل می شوند.

مقداری اطلاعات اضافی

در HTML یک خط جدید بعنوان یک فاصله حساب می شود.

برای وارد کردن یک خط خالی یک عملکرد بد است.بجای آن از برچسب <br>استفاده کنید.(اما از <br> برای ساخت لیست خالی استفاده نکنید ، صبر کنید تا در مورد لیستهای HTML یاد بگیرید)
شما ممکن است متوجه باشید که پاراگراف ها می توانند بدون بستن برچسب <p/> نوشته شوند.نسخه بعدی HTML اجازه نخواهد داد که هیچ برچسب پایانی را جا بیندازید. HTML بطور خودکار یک خط خالی اضافی قبل و بعد از برخی عناصر اضافه می کند مثل قبل و بعد از پاراگراف و قبل و بعد از سر تیتر ها.

برچسب <hr> یک خط افقی رسم می کند.

جمع بندی برچسب های پایه:

<html>: یک پرونده HTML را معرفی می کند.
<body>: بدنه پرونده را معرفی می کند.
<h1> تا <h6>: سر تیتر ۱ تا ۶ را معرفی می کند.
<p>: یک پاراگراف را معرفی می کند.
<br>: یک خط خالی را معرفی می کند.
<hr>: یک خط افقی را معرفی می کند.
<!–>: توضیحات را معرفی می کند.

 

ادامه مطلب
اچتمل برنامه نویسی 0 دیدگاه تعداد بازدید: 34
ساختار html

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

یادگیری اچتمل بسیار آسان است و شما از آن لذت خواهید برد!

یک فایل HTML چیست؟

  • HTML مخفف زبان نشانه گذاری فرا متنی است(hyper text markup language).
  • یک فایل HTML یک فایل متنی حاوی برچسب های کوچک نشانه گذاریست
  • بر چسب های نشانه گذاری به مرورگرهای وب بیان می کنند که صفحه را چگونه نشان دهد
  • یک فایل HTML باید دارای پسوند html. یا html. باشد
  • یک فایل HTML می تواند توسط یک ویرایشگر متنی ساده ساخته شود

آیا می خواهید یکبار امتحان کنید؟

اگر در حال کار با ویندوز هستید برنامه note pad را اجرا کنید. متن زیر را تایپ کنید.

<!DOCTYPE html>
<html>
<head>
<title>title of page </title>
</head>
<body>
This is my first home page.<b> This text is bold </b>
</body>
</html>

فایل را تحت عنوان “mypage.html”ذخیره کرده و به محل ذخیره بروید و فایل را باز کنید. فایل با مرورگر اینترنت باز خواهد شد. حالا شما یک آدرس در جعبه گفتگوی خود مشاهده خواهید کرد. بعنوان  مثال “C:\mypage.html” و مرورگر صفحه را به شما نشان خواهد داد.

نتیجه به صورت زیر خواهد بود:

This is my first home page. This text is bold

توضیح مثال:

  • اولین برچسب در فایل HTML که <!DOCTYPE html> است نشان می دهد شما از اچتمل ورژن ۵ استفاده می کنید. DOCTYPE فقط با حروف بزرگ و قبلا از هرچیزی در ابتدا باید نوشته شود، زیرا به مرورگرها کمک می کند صفحه وب را درست نمایش دهند.
  • برچسب <html> به مرورگر شما می فهماند که این آغاز یک فایل HTML است.
  • آخرین برچسب در فایل شما <html/> است.این برچسب به فایل شما می فهماند که این انتهای یک فایل HTML است.
  • متن های بین برچسب و اطلاعات سرانداز (header)شماست .اطلاعات سر انداز در پنجره مرورگر نشان داده نخواهد شد.
  • متن بین برچسب <title>، سرتیتر پرونده شماست. سرتیتر در قسمت عنوان صفحه مرورگر نشان داده خواهد شد.
  • متنی که در مرورگر نشان داده خواهد شد ، متنی است که بین برچسب <body> نشان داده خواهد شد.
  • متنی که بین برچسب <b> قرار گیرد در مرورگر بصورت برجسته نشان داده خواهد شد.

پسوند htm. یا html.؟

هنگامی که شما یک فایل HTML را ذخیره می کنید شما می توانید هرکدام از پسوندهای htm. یا html. را انتخاب کنید.ما در مثال هایمان از پسوند htm. استفاده می کنیم. این ممکن است یک رفتار بد موروثی از گذشته باشد که بیشتر نرم افزارهایی که استفاده می شوند فقط پسوند سه حرفی را قبول می کنند.با نرم افزار جدیدتر ما فکر می کنیم که اگر از پسوند html. استفاده کنیم بسیار ایمن تر خواهیم بود.

نکته:

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

 

تاریخچه:

HTML          ۱۹۹۱
HTML 2.0      ۱۹۹۵
HTML 3.2      ۱۹۹۷
HTML 4.01     ۱۹۹۹
XHTML         ۲۰۰۰
HTML5         ۲۰۱۴

منبع: سایت های  html – w3schools

ادامه مطلب

جملات ناب

خداوند به هر کس تابلوی نقاشی سفیدی در ابتدای زندگی او داده است. وقتی که خدا به ما قلمو و رنگ می‌دهد کلمۀ «هدف» را زمزمه می‌کند، و ما را آزاد می‌گذارد تا هنرمند زندگی خود باشیم. جان سی. مکسول