تگ input یکی از مهمترین تگ های موجود در تگ form می باشد. با استفاده از این تگ می توانیم کنترل های لازم بر روی اطلاعات کاربران را انجام دهیم. (طراحی سایت , سئو سایت , طراحی سایت )
در واقع تگ input نشان دهنده ی یک فیلد ورود اطلاعات می باشد. (طراحی سایت فروشگاهی , طراحی سایت شرکتی , ساخت سایت , قیمت طراحی سایت )
باتوجه به ویژگی و خصویت type می توانیم از فیلد ورودی input برای انواع ورودی های مختلف استفاده نماییم.
تگ input یک تگ بسته است و به صورت یک عنصر تنها به کار می رود.
اگر بخواهید در کنار input خود یک برچسب قرار دهید می توانید از تگ lable استفاده نمایید.
نمای کلی برای استفاده از تگ input به صورت زیر می باشد:
1 | <input type="type" name="name" > |
به طور مثال تگ input به کار رفته در عنصر form :
1 2 3 4 5 6 7 8 9 10 11 | <!DOCTYPE html> <html> <body style="direction:rtl"> <form name="input" action="html_form_action.php" method="get"> نام: <input type="text" name="FirstName" value="Amir" /><br /> فامیل: <input type="text" name="LastName" value="PahlevanSadegh" /><br /> <input type="submit" value="Submit" /> </form> </body> </html> |
| خصوصیت | مقدار | توضیحات |
|---|---|---|
| accept | file_extension audio/* video/* image/* media_type | این خصوصیت مشخص کننده نوع فایلی است که شما ارسال می کنید. این خصوصیت تنها برای file به کار میرود. |
| aling | left center right justify | این خصوصیت در حال حاضر در Html5 پشتیبانی نمی شود. با استفاده از این خصوصیت می توانیم image input را در جهت های مختلف ترازبندی کنیم. این خصوصیت تنها برای image به کار میرود. |
| alt | text | با استفاده از این خصوصیت می توانید برای عکس خود یک متن جایگزین استفاده کنید. این خصوصیت تنها برای image به کار میرود. |
| autocomplete | on off | با استفاده از این خصوصصیت می توانید مشخص کنید که فیلد های فرم ها به صورت اتوماتیک پر شوند یا خیر. پشتیبانی از Html5 |
| autofocus | autofocus | بااستفاده از این خصوصیت مکان نما در فیلد پیش فرض پس از لود صفحه قرار می گیرد. پشتیبانی از Html5 |
| checked | checked | بااسفاده از این ویژگی تگ input به طور خود کار پس از لود شدن صفحه در حالت انتخاب قرار می گیرد. این خصوصیت تنها برای checkbox و radio به کار میرود. |
| disabled | disabled | با استفاده از این خصوصیت می توانید تگ input خود را غیر فعال کنید. |
| form | form_id | با استفاده از این خصوصیت می توانید فرم هایی که به فیلد مورد نظر تعلق دارند را مشخص نمایید. پشتیبانی از Html5 |
| formaction | URL | این خصوصیت آدرس قسمتی که عملیات کنترلی برروی ورودی ها انجام می شود را ایجاد می کند. این خصوصیت تنها برای ورودی های image و submit به کار میرود. پشتیبانی از Html5 |
| formenctype | application/x-www-form-urlencoded multipart/form-data text/plain | توسط این خصوصیت چگونگی رمزگذاری برروی داده های فرم ها مشخص می شود. این خصوصیت تنها برای ورودی های image و submit به کار میرود. پشتیبانی از Html5 |
| formmethod | get post | این خصوصیت مشخص میکند که داده ها به کدام شکل به سرور انتقال داده شوند. این خصوصیت تنها برای ورودی های image و submit به کار میرود. پشتیبانی از Html5 |
| formnovalidate | formnovalidate | توسط این خصوصیت دیگر داده های ورودی به سرور نیازی به اعتبار سنجی ندارند. پشتیبانی از Html5 |
| formtarget | _blank _self _parent _top framename | توسط این خصوصیت می توانید مشخص کنید که پاسخ دریافت شده از سرور به چه نحوی به نمایش گذاشته شود. پشتیبانی از Html5 |
| height | pixels | توسط این خصوصیت می توانید ارتفاع تگ input را مشخص نمایید. این خصوصیت تنها برای image به کار میرود. پشتیبانی از Html5 |
| list | datalist_id | توسط این خصوصیت می توانید یک datalist را به فیلد متنی خود اضافه کنید. پشتیبانی از Html5 |
| max | number date | توسط این خصوصیت می توانید مقدار ماکسیمم تگ input را مشخص نمایید. پشتیبانی از Html5 |
| maxlength | number | توسط این خصوصیت می توانید تعداد ماکسیسم کاراکتری که می خواهید در فیلد خود قرار دهید را مشخص نمایید. پشتیبانی از Html5 |
| min | number date | توسط این خصوصیت می توانید تعداد مینیموم کاراکتری که می خواهید در فیلد خود قرار دهید را مشخص نمایید. پشتیبانی از Html5 |
| multiple | multiple | توسط این خصوصیت می توانید بیشتر از یک مقدار در تگ input قرار دهید. پشتیبانی از Html5 |
| name | text | توسط این خصوصیت یک نام برای تگ input قرار می دهیم. |
| pattern | regexp | بااستفاده از این خصوصیت یک الگو برای اعتبار سنجی فیلد ورودی می توانید مشخص کنید. پشتیبانی از Html5 |
| placeholder | text | توسط این خصوصیت می توانید نمونه ای از ورودی مورد نظر را قرار دهید تا به صورت کمرنگ در فیلد قرار بگیرد و با قرار گیری موس روی فیلد مورد نظر از بین می رود. پشتیبانی از Html5 |
| readonly | readonly | نشان دهنده این است که فیلد مورد نظر فقط خواندنی است. |
| required | required | این خصوصیت نشان می دهد که پر کردن فیلد توسط کاربر الزامی است. پشتیبانی از Html5 |
| size | number | توسط این تعداد کاراکتری که میتواند در تگ input قرار گیرد مشخص می شود. |
| src | URL | توسط این خصوصیت می توانید آدرس تصویری که میخواهید به عنوان دکمه جستجو استفاده کنید را قرار می دهید. این خصوصیت تنها برای image به کار میرود. |
| step | number | با استفاده از این خصوصیت می توانید مشخص کنید که تعداد فاصله ها در تگ input چگونه باشد. پشتیبانی از Html5 |
| type | button checkbox color date datetime datetime-local file hidden image month number password radio range reset search submit tel text time url week | توسط این خصوصیت می توانید مشخص کنید که نوع و نحوه نمایش تگ input به چه صورت باشد. می تواند به صورت دکمه یا فایل یا پسورد و یا ایمیل وغیره وجود داشته باشد. |
| value | text | با استفاده از این خصوصیت می توانید برای تگ input یک مقدار را مشخص نمایید. |
| width | pixels | توسط این خصوصیت می توانید عرض تگ input را مشخص نمایید. پشتیبانی از Html5 |
تگ input تمام ویژگی های عمومی و رویداد های عمومی را در Html پشتیبانی میکند.
تمامی مرور گر ها را پشتیبانی می کند.
در این مقاله با آموزش تگ blockquote در Html در کنار شما علاقمنداند یادگیری Html و همراهان سئوراز هستیم:
تگ blockquote برای نشان دادن نقل و ول به کار میرود.
تگ <blockquote> در اکثر مرورگرها به صورت برجسته و ویژه تری نمایش داده میشود. (طراحی سایت , سئو سایت , طراحی سایت )
(طراحی سایت فروشگاهی , طراحی سایت شرکتی , ساخت سایت , قیمت طراحی سایت )
1 | <blockquote cite="url">text</blockquote> |
برای مثال:
1 | <blockquote cite="https://seoraz.com/درباره-ما">سئوراز با سابقه 11 ساله در زمینه طراحی سایت ، سئو ، بهینه سازی سایت فعال میباشد. در حال حاضر با هدف یک تیم دانش بنیان ( استارتاپ ) دور هم گرد آمده ایم تا با ارائه ایده هایی بر پایه خدمات به نیاز های مشتریان پاسخگو باشیم.</blockquote> |
خروجی قطعه کد بالا:
سئوراز با سابقه 11 ساله در زمینه طراحی سایت ، سئو ، بهینه سازی سایت فعال میباشد. در حال حاضر با هدف یک تیم دانش بنیان ( استارتاپ ) دور هم گرد آمده ایم تا با ارائه ایده هایی بر پایه خدمات به نیاز های مشتریان پاسخگو باشیم.
تمامی مرورگرها از این تگ پشتیبانی می کنند.
| خصوصیت | مقدار | توضیحات |
| cite | url | مرجع یا منبعی متن را از روی آن برداشتیم. |
در این مقاله با آموزش تگ big در Html در کنار شما همراهان سئوراز هستیم:
تگ big برای بزرگتر نشان دادن بخشی از متن به کار برده میشود. توجه داشته باشید که برای بزرگتر نشان دادن به کار میرود برای ضخیم کردن به کار نمیرود. (طراحی سایت , سئو سایت , طراحی سایت )
در واقع تگ <big> مانند تگ font-size:larger عمل میکند به همین دلیل دیگر در html5 از تگ big استفاده نمیشود. (طراحی سایت فروشگاهی , طراحی سایت شرکتی , ساخت سایت , قیمت طراحی سایت )
1 | <big>Example text</big> |
برای مثال:
1 2 | <p>This Text is Normal</p> <p><big>This Text is Bigger</big></p> |
خروجی قطعه کد بالا:
This Text is Normal
This Text is Bigger
تمامی مرورگرها از این تگ پشتیبانی می کنند.
با آموزش تگ کامنت در Html همراه شما هستیم:
وقتی شما یک صفحه Html ایجاد می کنید پس از درج کدهای طولانی و تو در تو ممکن است پس از مدتی برای تغییرات در کدهایتان دچار مشکل شوید. چون آنقدر تعداد خطوط کد هایی که وارد کرده اید زیاد است نمی توانید برای تغییر خط حاوی کد مورد نظر خود اقدام لازم را انجام دهید، در نتیجه دچار سردرگمی می شوید.(طراحی سایت , سئو سایت , طراحی سایت )
تگ کامنت به شکل <–…–!> در صفحات Html قرار می گیرد.
تگ کامنت از این رو می تواند برای نشانه گذاری قسمت های مختلف کد html شما استفاده شود. (طراحی سایت فروشگاهی , طراحی سایت شرکتی , ساخت سایت , قیمت طراحی سایت )
همیشه سعی کنید بجا و به موقع ازین تگ استفاده کنید تا افرادی که بعد از شما می خواهند به ویرایش کد ها بپردازند به مشکل برنخورند.
یکی دیگر از کاربردهای مفید تگ کامنت، مخفی کردن بخشی از کدهای شمااست. برای این منظور تنها کافی است قطعه کد مورد نظر خود را در وسط تگ کامنت قرار دهید.
تگ های کامنت می توانند هم به صورت مشروط استفاده شوند و هم در یک نرم افزار ت
قطعه کد زیر نحوه کامنت گذاری در صفحات Html را نشان می دهد:
1 2 3 4 5 6 7 8 | <!--اینیکعبارتتوضیحیدرداخلکدهایاچتیامالاستکهدرمرورگرنمایشدادهنمیشود--> <p>اینیکپاراگرافاست.</p> <!--بااینکارقطعهکدزیرنمایشدادهنمیشود <img border="0"src="/portals/0/Images/the_scream.jpg"alt="تابلوی نقاشی جیغ"> --> |
تگ کامنت هیچ یک از ویژگی های عمومی و رویداد های عمومی را پشتیبانی نمیکند.
تمامی مرور گر ها را پشتیبانی می کند.
در این مقاله با آموزش تگ bdo در Html همراه علاقه مندان به یادگیری HTML هستیم. (طراحی سایت , سئو سایت , طراحی سایت )
تگ bdo در واقع مخفف شده عبارت Bi-Directional Override هست و به عنوان متن برگردان عمل میکند.(طراحی سایت فروشگاهی , طراحی سایت شرکتی , ساخت سایت , قیمت طراحی سایت )
برای آشنایی بیشتر با تگ <bdo> با ما همراه باشید.
1 | <bdo dir="ltr">text</bdo> |
برای مثال:
1 2 | <p>متن نمونه یک پاراگراف فارسی که راست به چپ است</p> <p><pdo dir="ltr">متن نمونه یک پاراگراف فارسی که راست به چپ است</pdo></p> |
خروجی قطعه کد بالا:
متن نمونه یک پاراگراف فارسی که از راست به چپ است
متن نمونه یک پاراگراف فارسی که از راست به چپ است
تمامی مرورگرها از این تگ پشتیبانی می کنند.
| خصوصیات | مقدار | توضیحات |
| dir | ltr rtl | استفاده از این خصوصیت برای این تگ لازم و ضرروری است و عدم استفاده از آن عملا باعث بی خاصیت شدن این تگ میشود. |