مشاهده تصویر بزرگتر

ویژگی text-shadow در css

ویژگی text-shadow در css | ویژگی text-shadow | صفت text-shadow

ویژگی text-shadow در css | ویژگی text-shadow | ویژگی text-shadow در css

در این مقاله از سایت آموزی به بررسی و تحلیل ویژگی text – shadow در زبان CSS می پردازیم.

از خاصیت text – shadow در CSS3 ، برای سایه دار کردن متن و نوشته در صفحات وب استفاده می شود .

به وسیله این خاصیت و به راحتی فقط با نوشتن یک کد ساده می توانید ، افکت تصویری بسیار زیبایی سایه را ، به متون خود اضافه نمایید .

کاری که پیش از این به هیچ عنوان در طراحی صفحات وب ممکن نبود .

شکل کلی استفاده از این خاصیت به صورت زیر است :

مثال در مورد ویژگی text – shadow در زبان CSS

text-shadow : h-shadow   v-shadow   blur   color;
text-shadow : 10px 10px 5px blue ;

1 2	text-shadow : h-shadow v-shadow blur color; text-shadow : 10px 10px 5px blue ;

خاصیت text – shadow به ما امکان تعیین دقیق مشخصات سایه را با پارامترهای خود می دهد .

در ادامه به تعریف و نحوه استفاده از ۴ پارامتر مذکور در خاصیت text – shadow می پردازیم :

پارامتر h-shadow

این پارامتر میزان فاصله سایه از لبه بالایی متن را بر حسب مقداری مثل px یا pt تعیین می کند .

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

نکته :

امکان مقدار دهی منفی برای این خاصیت نیز وجود دارد .

چنانچه مقدار این خاصیت منفی در نظر گرفته شود ، سایه بالاتر از لبه بالایی متن قرار می گیرد .

پارامتر v-shadow

این پارامتر میزان فاصله سایه از لبه سمت چپ متن را بر حسب مقداری مثل px یا pt تعیین می کند .

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

نکته :

امکان مقدار دهی منفی برای این خاصیت نیز وجود دارد .

چنانچه مقدار این خاصیت منفی در نظر گرفته شود ، سایه در سمت چپ لبه چپ متن قرار می گیرد .

پارامتر blur

این پارامتر یک افکت تصویری به سایه داده و باعث می شود اطراف سایه ایجاد شده به صورت مه آلود و تیره در بیاید .

مقدار این پارامتر بر حسب واحد px تعیین می شود مثل ۱۰px .

هر چه مقدار آن بیشتر باشد ، میزان مه آلودگی اطراف سایه نیز بیشتر خواهد شد .

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

پارامتر color

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