طراحی فرم ثبت نام | استوایی ostovaee

طراحی فرم ثبت نام

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

فیلم آموزشی طراحی فرم ثبت نام


مشخصات فیلم آموزشی
تولید کننده: وب سایت استوایی
مدرس: محمد علی زندی
حجم: 16.2 مگابایت
مدت زمان: 07:54 دقیقه
زبان:فارسی
تاریخ انتشار: 19 خرداد 1398

تگ div

تگ div یک تگ دارای محتوی می‌باشد که جهت تقسیم بندی تگ‌های Html از این تگ استفاده می‌شود.

آموزش رایگان طراحی Ui | استوایی

تگ img

تگ img یک تگ بدون محتوی می‌باشد که برای قرار دادن تصاویر از این تگ استفاده می‌شود.

<img  src=”آدرس تصویر” alt=”متن جایگزین درصورت عدم نمایش تصویر”>

طراحی فرم ثبت نام در Html

در این آموزش با استفاده از تگ input، img و button یک فرم اشتراک خبرنامه طراحی خواهد شد.

آدرس دهی در Html

در Html دو نوع آدرس‌دهی وجود دارد:

  • آدرس مطلق: آدرس مستقیم و کامل فایل می‌باشد بطور مثال G:\images\pic.jpg
  • آدرس نسبی: این نوع آدرس‌دهی از همان جایی که فایل نسبت به فایل Html وجود دارد آدرس‌دهی می‌شود. بطور مثال images\pic.jpg

توجه داشته باشید معمولا از آدرس‌دهی مطلق استفاده نمی‌شود و زمانی از آدرس‌دهی مطلق استفاده می‌شود که بخواهیم یک تصویر را بصورت مستقیم از سایت دیگری نمایش دهیم.

تگ input

یک تگ بدون محتوی می‌باشد و برای ساخت انواع کنترل‌ها مانند کادرهای متنی، دکمه و … استفاده می‌شود. نوع کنترل توسط خاصیت Type در درون تگ مشخص می‌شود.

<input  type=”نوع کنترل”  name=”نام منحصر به فرد”>

نوع کنترل می‌تواند Text، Password، Email، Date، Number، Button  و … باشد.

آموزش کاربردی طراحی Ui | استوایی

تگ button

یک تگ با محتوی می‌باشد که یک دکمه قابل کلیک کردن را به وجود می‌آورد.

تفاوت دکمه ایجاد شده با تگ button و input در این است که داخل تگ button می‌توان محتوایی شامل متن و تصویر گذاشت. در مواقعی که بخواهید از متن و تصویر (آیکون) برای دکمه استفاده کنید تگ button کاربرد دارد.
تگ button نیز دارای سه نوع button، submit، reset می‌باشد.

<button type=”button” >  Click me! </button> 

کاربرد تگ ‌ها در طراحی فرم ثبت نام

سرفصل های آموزش طراحی UI

4 نظر برای طراحی فرم ثبت نام ثبت شده

  1. سلام
    لینک اعتبار سنجی ایمیل با جاوااسکریپت در قسمت سرفصل های آموزش طراحی UI اشتباهه
    لطفا تصحیح کنید

    1. سلام دوست من. ممنونم که اطلاع دادید. لینک اصلاح شد

    1. سلام دوس عزیز. در جای درستی پیام ندادید. براتون یک ایمیل ارسال کردم و لینک ثبت نام رو فرستادم

دیدگاهتان را بنویسید

پر کردن تمام موارد زیر الزامیست