خاصية hyphens
آخر تحديث: 2026-09-13
hyphens خاصية hyphens
تتحكم خاصية hyphens في CSS فيما إذا كان المتصفح يستخدم الواصلات (-) لكسر الكلمات داخل الأسطر، وتُستخدم عادةً في اللغات متعددة المقاطع مثل الإنجليزية. مع تفعيل الوصل التلقائي، يُدرج المتصفح الواصلات في مواضع مناسبة بناءً على قاموس اللغة، فيلتف النص بشكل أكثر طبيعية عند حد الحاوية وتقل الفجوات غير المتساوية.
| الفئة | |
|---|---|
| القيمة الأولية | manual |
| موروث | نعم |
| ينطبق على | |
| نوع الحركة | |
| إصدار CSS | CSS3 |
| الحالة | قياسي |
📝 التركيب
hyphens: none | manual | auto;⚙️ القيم
| القيمة | النوع | الوصف |
|---|---|---|
none | manual | auto | كلمة مفتاحية | سلوك الوصل |
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفحات
| المتصفح |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| hyphens | ✓ v57 | ✓ v12 | ✓ v52 | ✓ v10.1 | ✓ v44 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
تلميح： تتطلب الوصل التلقائي سمة lang في HTML (مثل lang="en") كي يستعين المتصفح بقاموس اللغة لتحديد مواضع الكسر.
مهم： استخدم (الواصلة الناعمة) لتحديد مواضع الكسر المسموحة يدويًا؛ ولا تظهر الواصلة إلا عندما يحتاج المتصفح فعليًا إلى الكسر هناك.
❓ الأسئلة الشائعة
Qهل لخاصية hyphens أي تأثير على النص الصيني في CSS؟
Aلا يحتوي الصينية على مفهوم حدود الكلمات، لذا لا يكاد hyphens يؤثر على النص الصيني. يُتحكم في التفاف الصينية عادةً عبر word-break أو overflow-wrap.
Qما الفرق بين القيمتين manual وauto في hyphens؟
Aلا يكسر manual إلا عند المواضع التي حددتها صراحةً بواصلة ناعمة ()؛ بينما يترك auto للمتصفح اختيار مواضع الكسر بناءً على قاموس اللغة — وهو أكثر ذكاءً لكنه يتطلب سمة lang صحيحة.
Qكيف أجعل النص الإنجليزي يوصَل تلقائيًا بخاصية hyphens في CSS؟
Aاضبط hyphens: auto وتأكد من أن HTML يحتوي على سمة lang صحيحة (مثل lang="en")؛ حينها يُضيف المتصفح الواصلات في نهايات الكلمات وفق القاموس. ولا يكسر hyphens إلا عندما لا تتسع كلمة، ويعمل بشكل أفضل مع text-align: justify.
Qما هو دعم المتصفحات الحالي لخاصية hyphens في CSS؟
Aتدعمه كل المتصفحات الحديثة، لكن iOS Safari يتطلب بادئة -webkit-hyphens. وبما أنه يعتمد على قواميس اللغة، فقد يكسر النص نفسه في مواضع مختلفة ببيئات لغات مختلفة.
🏷️ خصائص ذات صلة
💡 حالات ذات صلة
📚 دروس ذات صلة
