- 3,501 بازدید
- بدون نظر
در گذشته برای سایه دار کردن جعبه و div های html تصویر مربوط به سایه را با استفاده از دستورات css مربوط به تصویر زمینه برای بخش مورد نظر ایجاد می کردند و اصلا چیزی به عنوان سایه متن وجود نداشت اما با آمدن نسخه جدید css قابلیت و خاصیتی به آن افزوده شد تا ایجاد سایه توسط Css برای متن نوشته و Div ها براحتی امکان پذیر شود این خاصیتها box-shadow و text-shadow نام دارند در این مطلب از سایت نحوه سایه دار کردن متن و div با استفاده از این خاصیتها را آموزش می دهیم پس تا پایان همراه ما باشید.
ایجاد سایه توسط Css برای متن نوشته و Div
به توضیح هر یک از مقادیر اختصاص داده شده به خاصیت های سایه نوشته و سایه جعبه یا div می پردازیم:
h-shadow : با تنظیم این گزینه سایه افقی تنظیم می شود مقدار برحسب پیکسل می باشد.
v-shadow : با تنظیم این گزینه سایه عمودی تنظیم می شود مقدار برحسب پیکسل می باشد.
blur : این گزینه برای میزان بلور و شفایفت سایه به کار می رود هرچقدر مقدار آن بیشتر باشد بلور سایه نیز بیشتر می شود.
spread : این پارامتر اندازه سایه را مشخص می کند.
color : برای انتخاب رنگ سایه کاربرد دارد و رنگ سایه را تعیین می کند.
inset : این گزینه سایه را به جای اینکه به بیرون جعبه ، بخش یا div منتشر کند و نمایش دهد به درون div انتقال می دهد.
اکثر خاصیتهای جدید ازجمله text-shadow و box-shadow در نسخه های قدیمی مرورگرها مخصوصا مرورگر ie از نسخه ۹ به پایین کار نمی کنند.
سایتهای آنلاین ایجاد سایه توسط Css برای متن نوشته و Div
یکی از راحت ترین روش های ایجاد سایه برای متن و جعبه div استفاده از سایتهای آنلاین می باشد عموما این سایتها با دریافت مقادیر مورد نیاز سایه تولید شده را نمایش می دهند و در نهایت کدهای مورد نیاز را در اختیار کاربر قرار می دهند، لیست برخی از سایتها در زیر آورده شده اند.
css3gen.com/text-shadow
cssmatic.com/box-shadow
درباره نویسنده : صادق