من الحاجات اللى لازم تبص عليها و تحاول تطبقها عندك ال Logical properties in css لأنها هتوفرلك وقت كبير خصوصا فى التطبيقات اللى فيها كزا لغة.
الموضوع ببساطة ان قديما كان الستايل فى الcss معتمد على الموقع الفعلى للعنصر يعنى لو انت عايز تزود المسافة بين عنصر و العنصر اللى على شماله هتحتاج تقول margin-left بس لو انت غيرت اتجاه الكتابة بتاعك هتحتاج انك تغير ده عشان تتوافق مع الاتجاه الجديد.
هنا تيجى ال logical properties عشان تحللك المشكلة دى بسهولة ، الموضوع ببساطة اننا بدل ما كنا بنعتمد على القيم الفعلية زى يمين و شمال و فوق و تحت دلوقتى بقينا بنعتمد على اتجاه الكتابة و على اساسه بنقدر نحدد كل القيم بتاعتنا عن طريق اننا بنستعمل محورين جداد بنقيس عليهم كل حاجة المحورين دول هما block dimension and inline dimension
الblock ده محور بيكون عمودى على محور الكتابة بمعنى انك لو بتكتب بلغة كتابة افقية هيكون هو المحور الرأسى و بالتالى بدل ما هتستخدم margin-top or margin-bottom هتستعمل margin-block-start or margin-block-end و بكدا هتبقى حددت مسافاتك اعتمادا على اتجاه الكتابة فقط مش اعتمادا على قيم انت اللى محددها بايدك
ال inline dimension هو محور موازى لمحور الكتابة فبدل ما هتستعمل margin-right or margin-left هتستعمل margin-inline-start or margin-inline-end.
الموضوع ممكن يكون محير شوية فى الأول بس لو قريت فيه و فهمته كويس هتقدر تسهل على نفسك كتير و توفر وقت كتير ليك
Top comments (0)