نص CSS3
CSS3 يحتوي على العديد من الميزات نص جديد.
في هذا الفصل سوف تتعلم حول خصائص النص التالي:
-
text-overflow
-
word-wrap
-
word-break
دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.
أرقام تليها -o- تحدد النسخة الأولى التي عملت مع بادئة.
الملكية | |||||
---|---|---|---|---|---|
text-overflow | 4.0 | 6.0 | 7.0 | 3.1 | 11.0 9.0 -o- |
word-wrap | 23.0 | 5.5 | 3.5 | 6.1 | 12.1 |
word-break | 4.0 | 5.5 | 15.0 | 3.1 | 15.0 |
CSS3 تجاوز النص
وCSS3 text-overflow
الخاصية تحديد كيفية محتوى فاضت أنه لا يتم عرض يجب أن أشار إلى المستخدم.
ويمكن أن يثقب:
هذه هي بعض النص الطويل الذي لن تجد لها مكانا في المربع
أو أنها يمكن أن تقدم على أنها علامة القطع (...):
هذه هي بعض النص الطويل الذي لن تجد لها مكانا في المربع
رمز المغلق هو على النحو التالي:
مثال
p.test1 {
white-space: nowrap;
width: 200px;
border: 1px solid #000000;
overflow: hidden;
text-overflow: clip;
}
p.test2 {
white-space: nowrap;
width: 200px;
border: 1px solid #000000;
overflow: hidden;
text-overflow: ellipsis;
}
انها محاولة لنفسك » يظهر المثال التالي كيف يمكنك عرض محتوى فاضت عندما تحوم فوق العنصر:
CSS3 كلمة تغليف
وCSS3 word-wrap
تسمح المنشأة الكلمات الطويلة لتكون قادرة على أن تكون مكسورة والتفاف على السطر التالي.
وإذا كانت الكلمة طويلة جدا لتناسب داخل المنطقة، وأنها توسع خارج:
تحتوي هذه الفقرة كلمة طويلة جدا: thisisaveryveryveryveryveryverylongword . إن كلمة طويلة كسر والتفاف إلى السطر التالي.
الخاصية التفاف يسمح لك لإجبار النص إلى التفاف - حتى لو كان ذلك يعني تقسيم في وسط الكلمة:
تحتوي هذه الفقرة كلمة طويلة جدا: thisisaveryveryveryveryveryverylongword . إن كلمة طويلة كسر والتفاف إلى السطر التالي.
رمز المغلق هو على النحو التالي:
مثال
السماح الكلمات الطويلة لتكون قادرة على أن تكون مكسورة والتفاف على السطر التالي:
p {
word-wrap: break-word;
}
انها محاولة لنفسك » CSS3 كلمة يكسر
وCSS3 word-break
تحدد الخاصية خط كسر القواعد.
تحتوي هذه الفقرة بعض النصوص. هذا الخط سوف-كسر-في-الواصلات.
تحتوي هذه الفقرة بعض النصوص. فإن خطوط كسر في أي حرف.
رمز المغلق هو على النحو التالي:
اختبر نفسك مع تمارين!
التمرين 1 » التمرين 2» التمرين 3 »
خصائص النص CSS3
يسرد الجدول التالي خصائص النص CSS3 الجديدة:
الملكية | وصف |
---|---|
text-align-last | يحدد كيفية محاذاة السطر الأخير من النص |
text-emphasis | والاختزال لوضع على غرار التركيز النص والنص التركيز الألوان في إعلان واحد |
text-justify | تحدد كيفية النص مبررة يجب أن تتماشى ومتباعدة |
text-overflow | يحدد محتوى كيف فاضت أنه لا يتم عرض يجب أن أشار إلى المستخدم |
word-break | يحدد خط قواعد كسر للمخطوطات غير كجك، |
word-wrap | يسمح الكلمات الطويلة لتكون قادرة على أن تكون مكسورة والتفاف على السطر التالي |