آیا می دانید میانگین رضایت دانشجویان سون لرن از دوره ها، بیش از 94% می باشد!

نکاتی کاربردی در مورد CSS (جلسه 7) : نکاتی در مورد border-width و border-image

0 246 ۲۷ آذر ۹۵

در این مطلب با ادامه نکاتی کاربردی در مورد CSS در خدمتتون هستیم. css-style

ویژگی border-width مقادیر کلیدواژه ای رو علاوه بر عدد قبول میکنه

علاوه بر قرار دادن مقادیر عددی مثل 5px یا 2em برای ویژگی border-width، شما میتونین کلید واژه هایی مثل thin و medium و thick رو بعنوان مقدار این ویژگی قرار بدید. معانی این مقادیر به ترتیب نازک و متوسط و ضخیم هست. در حقیقت زمانی که هیچ مقداری رو برای ویژگی border-width قرار نمیدید، مقدار medium برای border قرار داده میشه و مقدار پیش فرض این ویژگی medium هست. دموی زیر که در اون مقدار border-width برابر با thick قرار گرفته رو در نظر بگیرید: در بیشتر مرورگرها که بررسی کردیم متوجه شدیم که زمانی که مقادیر thin و medium و thick رو برای ویژگی border-width قرار میدیم، ضخامت border به ترتیب برابر با 1 و 3 و 5 پیکسل خواهد شد.

چرا خیلی کم از border-image استفاده میشه؟

شما میتونین اطلاعاتی در مورد border-image در این لینک بدست بیارید. این ویژگی در همه مرورگرها بجز IE10 و قدیمی تر از اون پشتیبانی میشه. با استفاده از این ویژگی میتونیم کارای جالبی رو انجام بدیم. سوالی که پیش میاد اینه که چرا از اون خیلی کم استفاده میشه؟

این ویژگی خیلی شسته و رفته هست و با استفاده از اون میتونین تصاویری رو بعنوان border المنت مورد نظرتون قرار بدید که fluid یا شناور باشن و با تغییر دادن اون المنت، بصورت زیبا واکنش نشون بدن و به نوعی واکنشگرا هستند و با هر تغییر سایزی، عکس العملی مناسب از خودشان به نمایش میزارن. برای مشاهده قابلیتهای این ویژگی، دموی زیر رو مشاهده کنید: همونطور که میبینید یک متن قرار گرفته و border از نوع تصویر هم برای اون قرار گرفته. حالا برای مشاهده شناور بودن اون، یک قسمت در پایین و سمت راست متن قرار گرفته که با گرفتن و درگ کردن اون میتونین باکس رو کوچک و بزرگ و Resize بکنید. با تغییر سایز این باکس میبینید که border-image چقد زیبا عکس العمل از خودش نشون میده و حالتشو از دست نمیده.

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

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

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

موفق و پیروز باشید.

یا علی

Source

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

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

ورود به سایت

ورود سریع با :
در حال اتصال ...

جستجو در سون لرن

عبارت :