قالب وردپرس پوسته وردپرس قالب فروشگاهی وردپس

طراحی کاراکتر در سایت طراحان برتر

طراحی کاراکتر

طراحی کاراکتر چیست؟ معمولأ صنعت های مختلف جهت معرفی بهتر و همچنین به خاطرسپاری محصولات و خدمات خود به عنصری در طراحی گرافیک روی می آورند به نام کاراکتر.

این کاراکترها در ارتباط با بازار هدف در اشکال و ابعاد گوناگون ظاهر می شوند.طراحی کاراکتر

این کاراکترها می توانند در قالب اسباب بازی ها- هیولاها- روبات، ماشین و… نمایان شوند. بدون یک کاراکتر مناسب محصولات نیاز به سرمایه گذاری بیشتری برای ماندگاری در ذهن مشتریان دارند. با استفاده از کارکترها می توان داستان های جالبی راجع به خدمات و محصولات ارائه داد و بدون کاراکترها این داستان ها شکل نمی گیرند. در کل یک کاراکتر خوب کاراکتری است که با اطراف خود هم شکل و همسان باشد و یک کاراکتر مناسب و به یاد ماندنی، هم باید از لحاظ ظاهری جذاب باشد و توانایی این را داشته باشد که بتواند بینند را از لحاظ روحی و احساسی با موضوع مورد نظر درگیر سازد.

شما به زودی خصوصیات یک کاراکتر را می شناسید. کارکترها می توانند زیبا، زشت، بسیار پیچیده و یا ساده باشند و خوبی کارکترها باعث می شود که آن کاراکتر را دنبال کنید و به تبع آن محصول و خدمت را نیز ببینید.

انواع کاراکترها:

کاراکتر اصلی main character

کاراکتر فرعی supporting character

کاراکتر مخالف opposing characters

کاراکتر ضعیف minor characters

موارد مورد توجه جهت انتخاب کاراکتر:

  • طراحی کاراکتر منطقی و احساسی؟

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

و پس از این فرآیند باید یک کمپین تبلیغاتی توسط تیم طراحان برتر نوشته شود تا این کاراکتر یا کاراکترها در ذهن مشتریان جای گیرد.

تخصص ما:

تخصص ما برای طراحی کاراکتر ها در چند مرحله خلاصه می شود از ابتدا تحقیق در خصوص نوع کاراکتر و جواب به سوالات مطرح شده در متن مقاله و سپس ارجاء تحقیق به واحد خلاقیت و پس از آن ارائه دو فرم تهیه شده در واحد تحقیق و توسعه طراحان برتر و اتاق فکر (خلاقیت) طراحان برتر به واحد طراحی گرافیک و آتلیه شرکت و سپس انجام نظرسنجی در خصوص کاراکترهای طراحی شده و در پایان ارائه روش استفاده این کاراکتر در کمپین های تبلیغاتی جهت افزایش فروش و معرفی بهت محصولات و خدمات برند شما.

طراحی انواع کارت گارانتی ، کارت تبریک ، کارت دعوت ، کارت پستال در طراحان برتر

طراحی کارت پستال

سنت ارسال کارت پستال به دوران حکومت ویکتوریایی در کشور انگلستان باز می گردد. در آغاز برخی از بزرگان نامه هایی می نواشتند تا بتوانند در آن نامه ها کریسمس را به دیگران تبریک بگویند ولی این کار نیاز به زمان بسیار زیادی داشت.طراحی انواع کارت گارانتی ، کارت تبریک ، کارت دعوت ، کارت پستال

در سال ۱۸۴۳ میلادی یک مغازه دار بریتانیایی تبار از یک نقاش خواست تا مقداری کارت پستال برای تبریک کریسمس چاپ نماید تنها ۱۰۰۰ کارت با رنگ سیاه و سفید به صورت دستی رنگ و آماده شده در این کارت ها یک خانواده بسیار شاد به نمایش کشیده شده بود ولی تمام این کارت ها دچار یک مشکل بود، مشکلی بسیار بزرگ . تمام افراد خانواده شراب در دست داشتند و چون این کارت ها نشان دهنده و رواج دهنده شراب خواری بود مورد انتقاد بساری قرار گرفت. در سال ۱۸۵۱ میلادی یک مغازه دار نخستین کارت پستال کریسمس که چاپی بود در آمریکا به فروش رسانید.

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

کارت پستال چیست؟

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

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

کارت پستال هایی با اهداف گوناگون برای قرن ۲۱ طراحی شده است که بسیار موضوعی، هدفمند، زیبا و با خلاقیت بسیار بالا با توجه به مناسبات مختلف طراحی شده اند

لازم به ذکر است که هر کارت پستال می تواند انواع موضوعات را در نظر بیننده در حوزه بازاریابی جلوه دهد:

  • تداعی کننده مناسبات
  • تداعی کننده آداب و رسوم و سنت ها هر ملیت
  • تداعی کننده اسطوره های هر ملیت
  • تداعی کننده مناظر زییای مربوط به هر کشور
  • ….و غیره

طراحی هر کارت پستال می تواند با اهداف گوناگون طراحی انجام شود:

مثل :

  • طراحی کارت پستال جهت دعوت افراد
  • طراحی کارت پستال های سه بعدی (بیشتر جنبه زیبایی شناسی دارد)
  • کارت پستال یاد بود جهت اعیاد و مناسبات
  • و ….

که می توان آن ها را در بین کارت پستال های جدید و قدیم دید که به طرزی زیبا و جذاب و کارآمد تهیه شده اند که هر یک در نوع خود بی نظیرند. که انواع آن را در زیر مشاهده می نمایید.

طراحی انواع کارت گارانتی ، کارت تبریک ، کارت دعوت ، کارت پستال

طراحی انواع کارت گارانتی ، کارت تبریک ، کارت دعوت ، کارت پستال

طراحی انواع کارت گارانتی ، کارت تبریک ، کارت دعوت ، کارت پستال

ساختار اصلی و اساسی آموزش css

در این مقاله از آموزش CSS به ساخت یک  Tooltipدر CSS می پردازیم.می دانیم که  Tooltip برای نمایش یک پیام خاص به کاربر مورد استفاده قرار می گیرد.

نحوه ساخت Tooltip در CSS

برای ساخت یک Tooltip  لازم است مقاله مربوط به آشنایی با position ها در CSS را بخوانید.این مقاله مثالی کاربردی  برای تمرین بیشتر در آموزش CSS خواهد بود که به شما کمک می کند دستورات آموزش داده شده را بهتر مسلط شوید و عمیق تر درک نمایید.

<style>
/* Tooltip container */
.tooltip {
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
    position: relative;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* Tooltip text */
.tooltip .tooltiptext {
width: 120px;
    visibility: hidden;
    background-color: brown;
    color: #fff;
    padding: 7px 0;
    border-radius: 8px;
    text-align: center;
    position: absolute;
    z-index: 2;
}



</style>

<div class="tooltip">mouse hover here
  <span class="tooltiptext">Tooltip text is here.</span>
</div>

کدهای بالا نحوه ساخت یک tooltip را در CSS آموزش می دهد.در مثال بالا با استفاده از یک تگ div و کلاس اختصاص داده شده به ان،این tooltip ساخته شده است.در مورد استفاده از کلاس ها در CSS در مقالات گذشته توضیح داده شد.خاصیت border-radius در CSS وظیفه انحنا بخشیدن به اطراف عنصر را دارد.از اینرو جهت زیبایی ظاهری خروجی کار، به اندازه کمی border-radius اختصاص داده شده است.عرض یا width این tooltip را برابر با ۱۲۰ پیکسل قرار داده ایم.در مورد اینکه چرا برای ساخت این tooltip از پوزیشن absolute استفاده شده ،به مقاله مربوطه آموزش انواع پوزیشن ها در CSS مراجعه نمایید.همانطور که مطرح شده بود ،پوزیشن absolute یکی از پرکاربردترین نوع پوزیشن ها در CSS محسوب می شود.لذا لازم است با کاربرد آن بیشتر آشنا شویم.دستور border-bottom  جهت ایجاد کادر در پایین اضافه شده است.در این دستور CSS ،توجه نمایید که به صورت مخفف ، ضخامت و رنگ بندی و نوع کادر (dotted) مشخص شده است که کادر را به صورت نقطه نقطه در پایین این عنصر قرار می دهد.می توانید از این کد برای ایجاد tooltip استفاده نمایید.توجه کنید که برای ایجاد یک tootip واقعی بهتر است از جاوااسکریپت هم استفاده نمایید.هرچند با استفاده از CSS می توان این tooltip را ایجاد کرد اما با استفاده از جاوااسکریپت ابزارها و امکانات نسبتا بیشتری برای ساخت tootip در css در اختیار ما قرار خواهد گرفت.طی چندین مقاله قصد داریم آموزش مقدماتی و پیشرفته CSS را دنبال کنیم.در صورتی که به آموزش جوملاعلاقه مند هستید کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

نکات مهم css

در ادامه مقالات آموزش CSS : شاید تا کنون دو مفهوم inline-block و float را در CSS دیده باشید.این دو دستور از جمله کاربردی ترین دستورات در CSS هستند.اما تا کنون مقاله ای را به شخصه ندیدم که دقیقا تفاوت انها در CSS را تشریح کند.

تفاوت بین float و inline-block در CSS

همانطور که در آموزش CSS دیده ایم ، دستور float برای شناور کردن یک تگ در CSS استفاده می شود.این دستور م یتواند یک عنصر را به سمت راست یا به سمت چپ شناور کند ، نکته مهم اینست که اگر عنصری دستور float بگیرد چه تاثیری بروی استایل و CSS سایر عناصر دارد؟ پاسخ اینست که اگر عنصری float ابرابر با Right بگیرد،عناصر همجوار را به سمت چپ منتقل می نماید.و برعکس هم صادق است.و اما دستور inline-block که یکی از انواع  display ها در CSS است ،چه کاری انجام می دهد و چه نقشی در CSS دارد؟اگر به چندین عنصر که در کنار هم هستند، با استفاده از دستورات CSS ، مقدار display برابر با inline-block ّدهیم،اتافقی که می افتد اینست که عناصر دقیقا مثل حالتی که Float دهیم کنار هم قرار می گیرند اما با این تفاوت که ،اگر عنصری در CSS از نوع inline-block باشد،عناصر کناری و مجاور خود را به سمت مقابل منتقل نمی کند.این نکته اساسی هرچند در CSS مغفول مانده ولی از اهمیت بسیار زیادی برخوردار است.پس تفاوت float و نمایش inline-block دقیقا در این است که تاثیر آنها بر روی عناصر مجاور متفاوت است.(آموزش برنامه نویسی آندروید)

تفاوت float و inline-block در CSS

اینکه در چه مواردی باید از کدام دستور استفاده کرد،بستگی به موقعیت و شرایط دارد،اما هردو روش در CSS کاربردهای خاص خود را دارد.هم دستور Float و هم دستور Inline-block برای طراحی قالب با استفاده از CSS مورد استفاده قرار می گیرد و مکررا  از آن می توان بهره برد.اما شناخت دقیق انها نیاز به آموزش تصویری CSS دارد.می توانید از آموزش های مربوط به CSS استفاده نمایید تا تسلط بیشتری نسبت به این موضوع پیدا کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

پازیشن های مختلف

پس از اینکه طی چندین مقاله با  برخی دستورات CSS آشنا دشمی اکنون نوبت به معرفی مفهوم position ها در CSS میرسد.می خواهیم انواع position ها در CSS را بررسی کرده و تفاوت انها را مورد بررسی قرار دهیم.این مقاله ششمین مقاله از سری آموزش CSS می باشد که به صورت کامل آموزش CSS حرفه ای را فرا می گیرید.

position ها و تفاوت آنها در CSS

در CSS یکی از مهمترین و کاربردی ترین مباحث ، مبحث position هاست.در CSS موقعیت ها یا پوزیشن های اصلی عبارت است از:

  • static
  • relative
  • fixed
  • absolute

انوااع position در css

نوع اول یعنی استاتیک  (static) ، بدین معناست که عنصر مورد نظر به صورت ایستا و به صورت پیش فرض موقعیت خود را تعیین می کند.مفهوم static را در مقایسه با سایر موارد بهتر خواهیم فهمید.ابتدا fixed را بررسی می کنیم.در CSS اگربخواهیم عنصری را در محلی ثابت نگه داریمکه حتی با تغییر اسکرول بار ،موقعیت ان جا به جا نشود از موقعبت مکانی fixed استفاده می کنیم.این موقعیت در CSS ،برای مواردی نظیر سیستم های چت استفاده می شود.یا در هر جایی که بخواهیم یک عنصر را در موقعیت خود ثابت نگه داریم.بنابراین توجه نمایید که هر عنصری که موقعیت ان fixed ّاشد موقعیت مکانی خود را نسبت به کل پنجره تنظیم می کند و حتی با تغییر اسکرول بازهم سرجای خود باقی می ماند.پس از ان نوبت به موقعیت مکانی absolute در CSS میرسد.این موقعیت در مواردی استفاده میشود که بخواهیم موقعیت یک عنصر را با CSS  بدون وابستگی به عناصر کناری تعیین کنیم.یعنی هر عنصری که position آن از نوع absolute باشد هیچ تاثیری روی سایر عناصر و موقعیت انها ندارد و به عکس،هیچ تاثیری از عناصر همجوار نمی پذیرد.این نوع position در CSS کاربرد فراوانی دارد.نکته قابل توجه که در فیلم آموزش CSS به آن اشاره کردیم این سات که موقعیت absolute ،موقعیت مکانی خود را نسبت به اولین عنصر والدی که موقعیتی غیر از استاتیک داشته باشد تنظیم میکند.همچنین موقعیت های absolute,fixed,relative را می توان با استفاده از خصوصیات top , bottom ,left , right موقعیت انها را تنظیم کرد.و اما پوزیشن releative معروف به position نسبی می باشد.با این پوزیشن در آموزش تصویری CSS قبلا آشنا شده ایم.جهت تسلط بیشتر بر این موارد،به آموزش CSS مراجعه کنید.در صورت علاقه مندی به آموزش ASP.NET کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

نگاهی متفاوت به Css

در این مقاله به یکی از مهمترین مقالات در زمینه CSS می پردازیم.بحث display ها هرچند در CSS کمتر به آن پرداخته شده اما یکی از مهم ترین و پایه ای ترین مطالب در زمینه آموزش CSS محسوب می شود.چرا که قالب بندی ها و طرح بندی ها در CSS بر پایه همین display انجام می شود.پس در این پست انواع display ها را د رcss مورد بررسی قرار می دهیم و سعی میکنیم با انواع مثال ها مطلب را روشن تر کنیم.

مقایسه display ها در CSS

تگ های مختلف،display های پیش فرش متفاتی دارند.به عنوان مثال تگ div در حالت پیش فرض display از نوع block دارد.یا تگ span به صورت پیش فرض display از نوع inline دارد.اما با استفاده از CSS م یتوانی dispaly های پیش فرض را تغییر دهیم.در لیست زیر،عناصری که display آنها در CSS از نوع block است را می بینیم:

در CSS ، اگر display برابر با block ّاشد بدین معناست که تمام سطر را در بر میگیرد.در گذشته در مقالات آموزش جامع CSS نیز به این موضوع پرداخته شد. از عناصر فوق تحت block-level elements یاد می شود و در طرح بندی و قالب بندی کاربرد زیادی دارند.اما نوع دیگری از عناصر در CSS دارای display از نوع inline هستند.عبارتند از:

  • <div>
  • <h1> – <h6>
  • <p>
  • <form>
  • <header>
  • <footer>
  • <section>

در صورتی که بخواهید یکی از عناصر را با استفاده از CSS مخفی نمایید،کافیست display آن را به حالت none تبدیل نمایید.عناصر دارای display معادل none در صفحه هستند اما دیده نمی شوند.در CSS دو روش برای مخفی کردن عناصر وجود دارد،یکی استفاده از displayو یکی استفاده از visibilty،تفاوت اینها چیست؟در CSS اگر display یک عنصر برابر با none باشد عملا مشابه اینست که هیچ وجود خارجی در سایت ندارد و هیچ تاثیری حتی روی عناصر مجاور و قالب هم نمی گذارد اما اگر عنصری دارای visibilty معادل با hidden  باشد در این حالت ، وجود خارجی عنصر حفظ می وشد و فقط از چشم کاربر مخفی می ماند اما تاثیر خود را در قالب و بر روی سایر اجزای صفحه حفظ می کند.

  • <span>
  • <a>
  • <img>

جهت مشاهده آموزش وردپرس کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

اصول اصلی لینک دهی در css

یکی از پرکاربردترین موارد در صفحات وب ، لینک ها هستند.از اینرو در این مقاله به رابطه لینک ها و CSS و همچنین نحوه تنظیم استایل های CSS لینک ها می پردازیم.چگونه می توان به لینک ها در صفحات وب ، استایل خاصی بخشید؟

استایل دهی به لینک ها با CSS

از آنجا که لینک ها هم نوعی متن هستند،از خصوصیات معرفی شده برای متون در CSS ، می توان برای لینک ها هم استفاده کرد.همچنین چون آشنایی با لینک ها در آموزش CSSاهمیت ویژه ای دارند سعی کنید به خوبی آشنا شوید با این مبحث ، به عنوان مثال:

  • font-size
  • color
  • font-family

با دستورات فوق می توان در CSS ، لینک ها را رنگ خاصی بخشید یا اینکه اندازه متن آنها را تغییر داد و یا اینکه فونت خاصی را به لینک ها اختصاص داد.برای هر لینک در CSS چندین وضعیت (state) وجود دارد از جمله:

  • a:link
  • a:visited
  • a:hover
  • a:active

توضیح اینکه: حالت اول مربوط به تمام لینک های صفحه می شود.یعنی تمام آن تگ های a که لینک دار هستند.می توان با این سلکتور دستورات CSS را اضافه نمود.حالت دوم مربوط به لینک هایی است که کاربر روی آنها کلیک کرده و در CSS با عنوان visited مشخص می وشند.حالت سوم مربوط به لینک هایی است که کاربر ماوس را روی آنها نگه داشته است.ان حالت را در CSS ،با عنوان hover می شناسند.مورد چهارم در CSS ،مربوطه به لینک هایی است که کاربر دکمه ماوس را روی انها فشار داده و نگه داشته است.در CSS به این حالت active گویند.

a:link {
    color: green;
}

/* visited link */
a:visited {
    color: red;
}

در مثال بالا به لینک هایی که بازدید نشده اند با دستور color در CSS ، رنگ سبز داده شده و لینک های بازدید شده رنگ قرمز دارند.توجه نمایید که در CSS ،حتما باید دستور active بعد از دستور hover باشد.برای اینکه زیرخط برای لینک ها ایجاد کنیم یا آن را حذف کنیم از دستور text-decoration استفاده می کنیم.

a:hover {
    text-decoration: underline;
}

در این مثال،زمانی که ماوس روی یک لینک قرار گیرد،یک زیر خط برای آن ظاهر می شود.اینها همه نکات مهم در CSS هستند که هرچند ریز،اما پرکاربرد و بسیار ضروری هستند.برای هر لینک می توانیم حتی رنگ پس زمینه هم انتخاب کنیم.این کار را می توان با دستور background-color انجام داد.می توان با استفاده از استایل های CSS ، یک لینک را به صورت یک دکمه تبدیل کرد.این آموزش در آموزش تصویری CSS در کلیک سایت مطرح شده است. جهت دریافت اطلاعات و آموزشهای دقیقتر و مثال های بیشتر می توانید از آموزش تصویری CSS در سایت استفاده نمایید.جهت دریافت آموزش وردپرس کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

فونت ها و ساختار ایجاد آن ها

هنگام استفاده از فونت ها در CSS ، نکات متعددی را می توان مورد بررسی قرار داد.نکاتی که لازم است برای استفاده از فونت ها در CSS بدانیم چیست؟

فونت ها و CSS

اولین دستور مربوط به فونت ها در CSS دستور font-family است. این دستور نوع فونت را در CSS تعیین می کند.به عنوان مثال اگر بخواهیم فونت را Tahoma انتخاب کنیم باید مقدار این دستور را برابر با Tahoma قرار دهیم.آموزش CSS پایه را با این مقاله دنبال می کنیم.

span {
    font-family: "Times New Roman", Times, serif;
}

در مثال بالا سه نوع فونت تعیین شده است،این حالت در CSS به مرورگر اشاره می کند که اگر فونت اول را نشناخت و موفق به نمایش ان نشد،فونت دوم را استفاده کند و اگر فونت دوم در CSS را نشناخت ، فونت سوم را نمایش دهید.اصطلاحا به آن fallback می گویند.فونت های مختلف را در CSS در این دستور باید با علامت کاما جدا کرد.دستور دیگری که برای کار با فونت ها در CSS وجود دارد،دستور font-style می باشد.دستور Font-style را با چندین مثال می بینیم:

span.normal {
    font-style: normal;
}

span.italic {
    font-style: italic;
}

span.oblique {
    font-style: oblique;
}

آموزش CSS را طی چندین مقاله است که دنبال می کنیم، مقدار normal موجب نمایش حالت عادی متن می شود،حالت دوم یعنی italic موجب می گردد متن در CSS ،به صورت شیب دار و کج (مورب) ظاهر گردد. مقدار سوم یعنی oblique موجب مب شود که فونت مشابه حالت دوم مورب گردد.پس می توان با CSS به نوشتار و متون صفحات وب ، استایل ها و ظاهر و خصوصیات خاصی را بخشید.دستور بعد در CSS دستور font-size است که اندازه نوته را تعیین می کند بر حسب پیکسل .البته علاوه بر px می توان از واحد pt هم برای تنظیم اندازه فونت در CSS استفاده نمود.همچنین واحد دیگری به نام em برای تعیین اندازه فونت در CSS وجود دارد.پس بنابراین از تمامی واحدهای فونت که معرفی شد می توان استفاده کرد.نکته دیگر اینست که در CSS می توان مقدار font-size را براساس درصد نیز تعیین کرد! به عنوان مثال ۱۰۰ درصد باشد.کاربرد font-weight در CSS آنست که میتوان فونت را bold یا برجسته تر نمود.مثال:

p.zakhim {
    font-weight: bold;
}

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

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

استایل های مختلف

این مقاله به نحوه استایل دهی به متن ها در صفحات وب ، با استفاده از CSS می پردازد.در این مقاله می بینیم که CSS چه ایزارهایی برای استایل دهی به متن ها در صفحات وب داراست.آموزش CSS را دنبال می کنیم.

تنظیم اندازه و رنگ متن با CSS

اولین مطلب برای تنظیم ویژگی های متن، در ارتباط با اندازه نوشتار و همچنین رنگ نوشتار است.در CSS برای تنظیم سایز فونت از دستور font-size استفاده می شود و همچنین برای تنظیم رنگ نوشتار ، از دستور color استفاده می شود.در فیلم آموزش CSS هم به این موضوع پرداختیم.

تنظیم چینش نوشتار در CSS

زبان هایی چون فارسی ،راست به چپ هستند و زبان هایی چون لاتین برخلاف آن.در CSS چگونه جهت نوشتار متن را تغییر دهیم؟برا ی اینکار در CSS دستوری به نام text-align وجود دارد که بوسیله آن می توان متن درون یک تگ را با CSS راست چین یا چپ چین کرد.این ویژگی در حالت پیش فرض مقدار left را در css دارد.اما هنگام استفاده از زبان فارسی،ما آن را برابر با Right قرار می دهیم.جهت وسط چین کردن نوشتار، از Center استفاده می شود.توجه فرمایید در CSS ،تنظیم چینش فقط مختص به متن نیست بلکه برای تصاویر هم میتوان چینش را در CSS مشخص کرد.در CSS همانند نرم افزار مایکروسافت ورد ، برای چینش متن گزینه ای به نام justify  وجود دارد که باعث میشود کلمات و فاصل آنها به گونه ای تنظیمگردد که اندازه و طول سطرها در CSS یکسان گردد.همین ویزگی هاست که قالب را راستچین و یا چپ چین می نماید.مطلب بعد آشنایی با text-decoration می باشد.برای اینکه یک متن را زیر خط دهیم (همانند لینک ها) می توان با CSS و دستور text-decoration این کار را انجام داد.برای تنظیم فاصله کاراکترها در CSS می توان ، از دستور letter-spacingاستفاده نمود و مقدار آن را بر حسب پیکسل تعیین نمود.

h1 {
    letter-spacing: 4px;
}

در مثال بالا،فاصله کاراکترها با دستور letter-spacing برابر با ۴ پیکسل تنظیم گردیده است.برای تنظیم فاصله خطوط در CSS ،از دستور line-height استفاده میشود.با استفاده از دستور line-height می توانیم فاصل بین خطوط را در CSS کم و یا زیاد کنیم.برای تعیین فاصله کلمات با استفاده از CSS ، از دستور word-spacing استفاده می شود.با دستور word-spacing می توان فاصله کلمات را در CSS کم یا زیادتر کرد.یکی دیگر از دستورات CSS ، دستور direction است که جهت نوشتار را مشخص می کند که از راست به چپ است یا به عکس.تفاوت این دستور با دستور text-align را قبلا در فیلم آموزش CSS توضیح داده ایم.

جهت آموزش asp.net کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

تنظیمات مختلف در css

در این مقاله با دو مفهوم width و همچنین height آشنا می شویم.تعیین طول  و عرض عناصر در CSS ، یکی از پله های مهم برای فراگیری و آموزش CSS محسوب می شود.هرچند مفوم width و Height در CSS ،پایه ای ومقدماتی است اما بسیار مهم و ضروری.

تعیین طول و عرض با Width و Height در CSS

دستور width برای مشخص نموردن طول در CSS مورد استفاده قرار می گیرد.واحد طول در CSS ،پیکسل می باشد. به عنوان مثال عرض یک عنصر را می توان ۲۰px قرار داد.در CSS می توان width و height را به حالت auto قرار داد.در حالت پیش فرض نیز در CSS طول و عرض auto می باشد.در حالت تنظیم اتوماتیک در CSS ، بسته به محتوای درون عنصر HTML ، خودکار ظول و عرض تعیین می شود و نیازی نیست به عنصر طول و عرض بدهیم.توجه کنید که در CSS ،دو دستور width و height ،شامل کادرها و حاشیه داخلی نمی شود.بدین معنا که در CSS اگر height را برابر با ۱۰۰ پیکسل بگذاریم، padding هرچقدر هم که باشد تاثیری روی ارتفاع عنصر ندارد.پس در CSS ، طول و عرضی که تعیین می کنیم،خالص است یعنی بدون حاشیه داخلی و یا کادرهای اطراف تگ در CSS.برای تعیین بیشینه عرض و ارتفاع یک تگ در CSS می توان از دو دستور max-width و همچنین max-height استفاده نمود.با استفاده از این دو دستور میتوانیم ماکزیمم طول و عرض عناصر را در CSS تعیین نماییم.به صورت مشابه،برای تعیین مینیمم مقدار طول و عرض در CSS می توانیم،از دو دستور min-width و همچنین min-height استفاده کنیم تا اجازه ندهیم در CSS ،طول و عرض عنصر از مقادیر تعیین شده کمتر شود.در اینحالت در CSS ، باز هم برحسب واحد پیکسل باید مقادیر را تعیین نماییم.جهت آموزش تصویری CSS کلیک کنید.

تعیین طول و عرض به صورت درصد در CSS

در CSS می توانیم به جز پیکسل،از درصد هم استفاده کنیم،به عنوان مثال:

div {
    max-width: 500px;
    height: 40%;
    border: 3px solid #73AD21;
}

در مثال بالا تگ div ،ارتفاعی برابر با ۵۰ درصد عنصر والد خود خواهد داشت.یعنی ارتفاع عنصر در CSS ، بر اساس ارتفاع والد آن قابل مشخص شدن است.در ادامه به مقالات دیگر درباره آموزش CSS می پردازیم.

تعیین طول و عرض در CSS , آموزش width در CSS

جهت آموزش جوملا کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

اصول اصلی css

در CSS چگونه حاشیه ها را تنظیم کنیم؟در مقالات گذشته با چند دستور مختلف در CSS آشنا شدیم.اما در این بخش میخواهیم به نحوه تنظیم حاشیه در CSS بپردازیم.

حاشیه داخلی و خارجی در CSS

در CSS به دو صورت میتوان حاشیه را تنظیم کرد،این مبحث نیز جهت آموزش CSS حرفه ای لازم می باشد.پیشنهاد می شود از فیلم آموزش CSS نیز استفاده نمایید.

نخست دستور padding در CSS و دوم دستور margin در CSS. هر یک از این دستورات در جای خود در CSS کاربرد دارند.تفاوت این دو دستور چیست؟دستور margin در CSS در حقیقت حاشیه خارجی را تعیین می کند.یعنی فاصله یک عنصر HTML از عناصر اطراف آن.اما دستور padding در CSS چه می کند؟ این دستور برای تنظیم حاشیه داخلی در CSS کاربرد دارد.بدین صورت که فاصله محتوای یک عنصر را از دیواره عنصر والد تعیین می کند.معمولا از این دو دستور برای تنظیم حاشیه استفاده می شود.دستور padding را در CSS ژمانی به کار می برند که بخواهند محتوای یک عنصر از اطرلاف عنصر پدر فاصله بگیرد.دستور margin در CSS به چهار جهت تقسیم می شود:

  • margin-top
  • margin-right
  • margin-bottom
  • margin-left

این چهار دستور برای تنظیم حاشیه از چهار طرف در CSS استفاده می شود.مشابه با دستور margin ، برای دستور padding هم همین حالت وجود دارد.حاشیه داخلی از بالا،راست،پایین و چپ در CSS.توجه نمایید که در CSS می توان margin و padding با مقدار منفی نیز به یک عنصر تخصیص داد.در حقیقت مقدار منفی،جهت حاشیه را معکوس می کند.این دو دستور در آموزش CSS ، بسیار پرکاربرد هستند و در موارد بسیار زیادی از آنها استفاده می گردد.از اینرو لازم است با دستور margin و همچنین padding آشنایی کافی داشته باشیم.علاوه بر شبوه ذکر شده،می توانیم برای ایجاد حاشیه در CSS ، از شیوه خلاصه شده و مخفف نیز استفاده کنیم.در ان حالت فرمت دستور CSS برای margin بدین صورت است:

p {
    margin: 10px 150px 10px 80px;
}

اعداد مشخص شده به ترتیب،حاشیه CSS از بالا،راست،پایین و سمت چپ هستند.به همین صورت برای دستور padding هم همین شیوه مخفف را می توان به کار برد.

حشایه در CSS

در تصویر بالا حاشیه CSS با رنگ زرد مشخص شده است.عنصر A از عنصر B حاشیه سمت رساتی یعنی margin-right دارد،بنابراین بین این دو عنصر CSS حاشیه یا margin وجود دارد.در مقالات بعد به آموزش ASP.NET می پردازیم.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

ساخت پس زمینه های مختلف

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

ایجاد پس زمینه در CSS و background در CSS

آموزش CSS مقدماتی را ادامه می دهیم.در CSS برای ایجاد و یا تغییر background  از دستور background  استفاده می کنیم.توجه فرمایید که برای تعیین background  می توان روش های متعددی از جمله رنگ آمیزی پس زمینه ، تصویر در پس زمینه و … استفاده نمود.در مثال زیر را با نحوه تعیین رنگ برای پس زمینه آشنا می شویم:

body {
    background-color: #000;
}

و اما سوال این است در CSS رنگ ها چگونه تعیین می شوند؟ آشنایی با رنگ ها لازمه آموزش CSS است. می دانیم در CSS ، رنگ ها در سیستم هگز (HEX) تعیین می شوند.در CSS هر رنگمعادل است با یک رشته ۶ حرفی، به عنوان مثال در CSS ، عبارت #۰۰۰۰۰۰ به معنای رنگ مشکی است یا اینکه می توان رنگ سفید را با #ffffff در CSS تعیین نمود.بنابراین با استفاده از دستور background-color می توان رنگ پس زمینه را در CSS تعیین نمود.همچنین CSS رنگ های لاتین را نیز می شناسد،بدین معنا که می تاونیم از عبارت green برای رنگ سبز در CSS استفاده کنیم.یا از عبارت red برای تعیین رنگ بندی قرمز در CSS استفاده کرد.اما برای درج تصویر در پس زمینه در CSS ، از دستور background-image می توان استفاده نمود.

body {
    background-image: url("back.gif");
}

در مثال بالا، تصویری به نام back.gif را پس زمینه کل بدنه صفحه وب قرار دادیم.این یکی  دیگر از دستورات CSS است که برای درج تصویر در پس زمینه می توان از آن استفاده کرد.اگر تصویر پس زمینه در یکی از پوشه های سایت باشد،لازم است در CSS ،مسیر آن تصویر را به صورت کامل بنویسیم.مثلا اگر در پوشه ای به نام images باشد،باید قبل از نام تصویر،عبارت images را نیز بگذاریم.برای اینکه تصویر در راستای محور افقی یا عمودی تکرار شود یا نشود،می توان از دستور background-repeat در CSS استفاده نمود.مثال:

background-repeat: no-repeat;

در کد بالا این دستور نشان داده شده است.اگر قصد دارید پس زمینه تکرار نشود ،از مقدار no-repeat استفاده نمایید و اگر قصد دارید در راستای محور افقی در CSS پس زمینه تکرار شود یا خیر از دستور background-repeat-x و در راستای محور عمودی در CSS از دستور background-repeat-y استفاده نمایید. در سیستم های مدیریت محتوا چون سیستم جوملا (آموزش جوملا ) و … نیز از همین سیستم استفاده می شود.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

آموزش جامع css

در جلسه قبل با مفهوم و کاربرد CSS آشنا شدیم، در این مقاله از سری مقالات آموزش CSS قصد داریم به این مبحث بپردازیم که چگونه و با استفاده از چه روش هایی می توان کدهای CSS را به صفحات وب متصل کرد؟

شیوه های وارد کردن کد CSS در صفحات وب

برای الحاق دستورات  CSS سه روش وجود دارد:

  • فراخوانی خارجی
  • روش Inline syle sheet در CSS
  • روش Inline-style

روش اول : در این روش تمام دستورات CSS را درون یک فایل خارج از صفحه اصلی می گذاریم.در یک فایل با پسوند .css و سپس آن فایل را به صفحه الحاق می کنیم.این روش مزیتی دارد که برای تغییرات دستورات CSS ، مستقیما به سراغ فایل CSS مورد نظر رفته و دستورات CSS را عوض می کنیم.این روش مزیت دیگری دارد که از شلوغ شدن صفحات وب جلوگیری می کند و کدهای CSS را در یک فایل کاملا مجزا قرار می دهد.از اینرو یکی از روش های رایج در فراخوانی دستورات CSS ،استفاده از فایل های خارجی (external) می باشد.(در صورت نیاز به آموزش تصویری CSS رجوع نمایید)

روش دوم:

در روش دوم همه دستورات CSS را درون یک تگ style قرار می دهند.در این روش دستورات مستقیما داخل خود صفحه وارد می شود نه در یک فایل خارجی.بر خلاف روش اول،این روش در CSS کاربرد کمتری دارد و رایج نیست.هرچند مزایایی در CSS دارد.در نمونه زیر این مسئله را می بینید:

<style>
body {
    background-color: linen;
}

h1 {
    color: maroon;
    margin-left: 40px;
}
</style>

در مثال بالا می بینیم که دستورات CSS در داخل یک تگ style نهفته شده است،از اینرو به این روش در CSS ،روش Inline style sheet یا فراخوانی داخلی گفته می شود.حسن این روش در CSS یکجا بودن دستورات و دسترسی سریعتر و همچنین عدم تعدد فایل های طراحی می باشد.

روش سوم:

در روش سوم کدهای CSS را در درون تگ ابتدایی در HTML می نویسیم، اگر بخواهیم در CSS این موضوع ا بهتر متوجه شویم این مثال را دقت کنید:

 <h1 style="color:Red;margin-left:3px;">heading.</h1>

در این مثال می بینید که با استفاده از خصوصیت (attribute) به نام style ،یک سری دستورات CSS را به این تگ اضافه کرده ایم.اولویت در دستورات CSS  : در CSS اولویت با روش سوم است.یعنی هرچه دستورات CSS ، به تگ نزدیکتر شوند ، اولویت اجرای انها توسط مرورگر بالاتر خواهد بود.به همین دلیل می توان از روش سوم برای افزودن خصوصیات CSS به صورت اختصاصی استفاده نمود.نحوه افزودن کدهای CSS به صفحات وب

با توجه به درخواست های مکرر دوستان ، به آموزش برنامه نویسی آندروید نیز خواهیم پرداخت.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

css چیست

در سری مقالات بلاگ CSS ، ابتدا می خواهیم کاربرد CSS را متوجه شویم.واقعا آموزش CSS برای طراحی وب لازم است؟چرا باید CSS را یاد گرفت؟ آیا بدون CSS می توان سایت طراحی کرد؟پاسخ این سوالات را در این بخش خواهیم دید.

آشنایی با CSS و کاربرد CSS

CSS مخفف  Cascading Style Sheets  می باشد. در واقع زبان CSS وظیف ایجاد استایل ها و تعیین ظواهر وب سایت را بر عهده دارد. اگر بخواهیم بهتر با مفهوم CSS آشنا شویم، این مثال را برای CSS در نظر بگیرید: برای ساخت یک ساختمان لازم است ابتدا بدنه ساختمان پیاده شود، اما آیا پس از پایان اسکلت ساختمان ، قابل بهره برداری است؟خیر.CSS چه نقشی دارد؟در طراحی وب دقیقا CSS همانند تعیین دکوراسیون و رنگ آمیزی ساختمان اسکلت ، می ماند.بدیم معنا که CSS ، صفحات وب را جانی تازه می بخشد و از حالت خشک و بی روح خود خارج می کند.CSS کار طراحان وب را بسیار ساده تر کرده و ابزارها و اختیارات فراوانی در اختیارشان قرار داده است.چرا که CSS ، به سادگی با دستورات قدرتمند خود، امکان دیزاین و طراحی صفحات HTML را به ما میدهد.در این مقاله و چند مقاله بعد به آموزش مقدماتی CSS می پردازیم.

در عین حال که CSS یک ابزار بسیار قدرتمند محسوب می شود، آموزش  CSS کاری دشوار نیست. چرا که ساختار آن بر پایه شیوایی و سادگی بنا شده است.

CSS چیست؟

در تصویر بالا ساختار و سینتکس کلی دستورات CSS را می بینیم.در قسمت selector باید عنصور مورد نظر جهت استایل دهی را تعیین کرد.در قسمت property باید نام ویژگی مورد نظر در CSS و سپس در قسمت value باید مقدار مورد نظر را در CSS مشخص نمود.به عنوان مثال، در دستور CSS  بالا ، رنگ نوشته و همچنین سایز فونت را مشخص کرده ایم.برای جدا کردن چند property مختلف در CSS ، از علامت ; استفاده می شود.پس ساختار کلی دستورات CSS را در این مقاله شناختیم.در این سری مقالات به آموزش های مختلفی برای CSS خواهیم پرداخت.آشنایی با CSS به همه دوستانی که قصد فراگیری طراحی وب را دارند پیشنهاد می گردد.همانطور که می دانید CSS یکی از ربان ها سمت کاربر است ، برای یادگیری زبان های سمت سرور می توانید از آموزش Asp.net استفاده نمایید.

انواع Selector ها در CSS

در CSS انواع مختلفی از سلکتورها را داریم.اولین نوع ان استفاده از نام عنصر HTML است،روش دوم استفاده از id در CSS و روش سوم استفاده از Class در CSS.در طراحی با CSS هر یک از این روش ها به درخور شرایط مورد استفاده قرار می گیرد.در مقالات بعدی با سایر مفاهیم CSS آشنا خواهیم شد.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

روش های اصلی یادگیری html

در این بخش به معرفی و بحث انواع Input ها در HTML می پردازیم.تگ های Input در HTML ، چه کاربردی دارد؟ هدف از استفاده تگ های Input در HTML چیست؟در این پست ، به صورت خلاصه به انواع تگ های input اشاره می کنیم.قبلا در آموزش مقدماتی HTML به این موضوع پرداختیم.

انواع تگ Input در طراحی با HTML

تگ های input همانگونه که از نام آنها مشخص است، برای دریافت ورودی از کاربر مورد استفاده قرار می گیرد.تگ های input دارای خصوصیات متعدد و مختلفی هستند و هر یک از انها در HTML ، برای یک کاربرد خاصی استفاده می شود.رایج ترین نوع Input در HTML ، نوع text می باشد. این نوع input برای دریافت یک متن و رشته متنی در HTML استفاده می شود.تگ های input ، عموما درون تگ form قرار می گیرند و پس از دریافت اطلاعات انها را به مقصد ارسال می کنند.تگ input با type برابر با checkbox ، در صفحه HTML یک گزینه چک باکس قابل تیک خوردن می سازد که به کمک ان می توان اطلاعاتی را از کاربر دریافت نمود.همچنین برای دریافت پسورد از کاربر ، از input با نوع password استفاده می شود.همچنین ، از input یا نوع submit برای ارسال اطلاعات فرم استفاده می شود.بنابراین ، تعدد input ها در HTML این امکان را به ما می دهد که درخور نوع داده ورودی ، از آنها در صفحات و فرم های HTML استفاده کنیم.

 <form action="page.php">
  First name:<br>
  <input type="text" name="name" value="reza"><br>
  Last name:<br>
  <input type="text" name="family" value="razavi"><br><br>
  <input type="submit" value="Submit">
</form>

در این مثال ، می بینید که از دو نوع تگ input جهت دریافت اطلاعات استفاده شده است.علاوه بر این ،نوع radio نیز وجود دارد.در مثال زیر می توانیم این تگ را در HTML ببینیم:

 <form>
  <input type="radio" name="آقا" value="1" checked>
  <input type="radio" name="خانم" value="1" checked>
</form>

همانطور که مشخص است، از تگ input با type برابر با radio ،می توان دکمه های radio در صفحات HTML ایجاد کرد.در صفحات HTML ، عموما در فرم های ثبت نام از انواع input ها استفاده می شود.علاوه بر موارد بالا ،در HTML نوع دیگری input نیز وجود دارد به نام button : این نوع input وظیف ایجاد یک دکمه در صفحه HTML را بر عهده دارد.از دکمه ها می توان برای ارسال اطلاعات یک فرم استفاده نمود.انواع دیگری از input ، در نسخه ۵ زبان HTML اضافه شده است، از جمله نوع color و نوع date و یا نوع time که در مقالات دیگر به آن ها خواهیم پرداخت.به هر حال ،آشنایی و شناخت کافی نسبت به input ها گامی مهم در زمینه آموزش HTML محسوب می گردد.در صورت علاقه مندی به آموزش برنامه نویسی آندروید کلیک کنید.

 

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

قالب وردپرس پوسته وردپرس قالب فروشگاهی وردپس