فرم ها (3) و دکمه ها در بوت استرپ
ادامه فرم ها
با سیستم شبکه پیشفرض که در بوت استرپ وجود دارد، میتوانید از سیستم .span* استفاده کنید
برای اندازه کنترل های فرم علاوه بر روش اندازه ستون دهانه، شما همچنین می توانید
از تعداد انگشت شماری از کلاس ها استفاده کنید که رویکردی نسبی به اندازه گیری دارند. اگر می خواهید ورودی به
به عنوان یک عنصر در سطح بلوک عمل کنید، می توانید .input-block-level را اضافه کنید و کامل خواهد شد.
علاوه بر استفاده از .span* برای اندازه ورودی، می توانید از چند نام کلاس مختلف نیز استفاده کنید :
input-mini
input-small
input-large
input-xlarge
input-medium
input-xxlarge
می توانید از هر .span از .span1 تا .span12 برای اندازه کنترل فرم استفاده کنید ، اگر می خواهید از چندین ورودی در یک خط استفاده کنید، به سادگی از اصلاح کننده .controls-row استفاده کنید
کلاس برای اعمال فاصله مناسب ، ورودی ها را شناور می کند تا از بین برود
فضای سفید؛ حاشیه های صحیح را تعیین می کند. و مانند کلاس row، float را پاک می کند.
اگر می خواهید یک کنترل فرم را بدون اجازه به کاربر برای ویرایش ورودی ارائه دهید، به سادگی
کلاس .uneditable-input را اضافه کنید ، با کنترلهای فرم بوت استرپ میتوانند متن بلوکی یا درون خطی داشته باشند که همراه با ورودیها جریان مییابد.
علاوه بر حالت فوکوس، بوت استرپ برای ورودیها و کلاسهای غیرفعال یک ظاهر طراحی میکند.
و کلاس هایی برای اعتبار سنجی فرم.
هنگامی که یک ورودی :focus را دریافت می کند (یعنی کاربر روی ورودی کلیک می کند یا نشانه گر موس را روی آن می گذارد)،
طرح کلی ورودی حذف شده و یک کادر سایه اعمال می شود. اولین بار این کار در شایت توییتر رخ داد ،
و غافل گیر کننده بود که با webkit این کار را انجام دادند.
<input> دارای یک جعبه سایه کوچک است که ظاهری را به ورودی می دهد
پایین تر از صفحه قرار می گیرد. هنگامی که :focus اعمال می شود، یک آبی روشن 8 پیکسل
مرز ظاهر می شود. webkit-transition به مرورگر می گوید که افکت را به صورت خطی اعمال کند
(روشی بیش از 0.2 ثانیه.)
اگر نیاز به غیرفعال کردن ورودی دارید، افزودن ویژگی disabled نه تنها غیرفعال میشود
بلکه همچنین هنگامی که مکان نما روی آن قرار می گیرد، استایل و مکان نما ماوس را تغییر می دهد.
بوت استرپ شامل سبک های اعتبارسنجی برای خطا، هشدار، اطلاعات و پیام های موفقیت است. برای استفاده، به سادگی کلاس مناسب را به .control- اطراف اضافه کنید.
دکمه ها
یکی از ویژگی های جذاب در Bootstrap نحوه استایل بندی دکمه ها است. دیو وینر،
مخترع RSS و طرفدار بزرگ بوت استرپ است.
اگر به دکمه های بزرگتر یا کوچکتر نیاز دارید، به سادگی btn-large، .btn-small یا .btn- را اضافه کنید.
اگر میخواهید دکمههایی ایجاد کنید که مانند یک عنصر در سطح بلوک نمایش داده شوند، به سادگی .btn-block را اضافه کنید.
برای عناصر لنگر، به سادگی کلاس .disabled را به تگ اضافه کنید و پیوند محو خواهد شد
در رنگ، و از دست دادن گرادیانت.
برای یک دکمه، به سادگی ویژگی disabled را به دکمه اضافه کنید. این
در واقع دکمه را غیرفعال می کند، بنابراین جاوا اسکریپت مستقیما مورد نیاز نیست.
قوانین ارسال دیدگاه در سایت