تغيير اتجاه ظل CSS الموجود

Question

لدي ظل CSS التالي:

box-shadow:green 0 1px 3px;

الآن ، إذا أردت تغيير فقط اتجاه من الظل ، حاولت:

box-shadow:inherit 2px 0 inherit;

لكن هذا لا يعمل للأسف. كما أنه لا يبدو أن هناك خصائص إضافية متاحة مثل:

box-shadow-direction:2px 0;

أو

box-shadow-color:inherit;

---

كيف يمكن تغيير الاتجاه دون تغيير اللون أو القوة؟

Answer 1

اعتبارًا أنني أعلم أنه لا يوجد مثل الجوز الفرعي background-repeat, margin-left, border-bottom إلى عن على box-shadow, text-shadow CSS3 صفات. لمزيد من التفاصيل ، يرجى الرجوع: http://www.w3.org/tr/css3-background/#box-shadow .

ترفق خاصية "box-shadow" واحدة أو أكثر من الظل في الصندوق. الخاصية عبارة عن قائمة ظلال مفصولة بفاصلة ، كل منها محدد بقيم الطول 2-4 ولون اختياري وكلمة "أقحم" اختيارية. الأطوال المحذوفة هي 0 ؛ الألوان المحذوفة هي لون مختار UA.

أين

<shadow> = inset? && [ <length>{2,4} && <color>? ]

لذلك ، لا يمكنك إعطاء جدير فرعي مثل box-shadow-direction:2px 0; بعد التعريف box-shadow إلى عنصر HTML حتى جاء أو تشبه الجدير الفرعي للعيش في الإصدارات التالية من CSS.

Answer 2

يتم تعريف ظل المربع على هذا النحو: لون انتشار XY Blur.

لذلك إذا كنت ترغب في تحريك ظل الصندوق الخاص بك ، فقم بتغيير x و y.

box-shadow: 10px 10px 5px #000;

ينشئ هذا الرمز ظل صندوق أسود يتم وضعه 10 بكسل من الأعلى واليسار. (لاحظ أنه لم يكن عليّ تحديد مبلغ الانتشار.)