منشئ حدود CSS
صمّم حدًا بصريًا — السماكة، النمط (solid, dashed, dotted, double…)، اللون، ونصف القطر — مع معاينة حية.
669 مشاهدة
خاصية border
الصيغة المختصرة: border: السماكة النمط اللون، مثل border: 2px dashed #5b3df5. تشمل الأنماط solid وdashed وdotted وdouble وgroove وridge وinset وoutset. ادمجها مع border-radius للحصول على إطارات مستديرة، أو طبّق النمط على جانب واحد فقط (border-top وغيره) لإضافة لمسات مثل خط تحت التبويب.
الأسئلة الشائعة
لماذا يُغيّر الحد حجم العنصر؟
بشكل افتراضي تُضاف الحدود إلى أبعاد الصندوق. فعِّل box-sizing: border-box ليشمل العرض والارتفاع الحدَّ أيضًا — وهو المعيار الحديث الذي تتّبعه معظم أدوات إعادة الضبط.
كم يجب أن يبلغ سُمك الحد لتظهر double بوضوح؟
يحتاج نمط double إلى 3px على الأقل — خطّان بينهما فجوة. وما دون ذلك يُرسم كخط واحد فقط.
أدوات مشابهة
منشئ تدرجات CSS
صمّم تدرجات CSS خطية ودائرية ومخروطية مع معاينة حية، وانسخ الكود مباشرة.
أنشئ
منشئ ظل الصندوق CSS
صمّم ظل الصندوق (box-shadow) بصريًا — الإزاحات، التمويه، الانتشار، اللون، الشفافية وinset — مع معاينة حية.
أنشئ
منشئ استدارة الحواف CSS
دوّر كل زاوية على حدة أو جميعها معًا، بوحدة px أو %، مع معاينة حية وكود CSS قابل للنسخ.
أنشئ
منشئ ظل النص CSS
صمّم ظل نص (text-shadow) بتحديد الإزاحة والتمويه واللون والشفافية — مع معاينة حية على نص تجريبي.
أنشئ
الإبلاغ عن مشكلة
منشئ حدود CSS