انتقل إلى محتوى الدرس
الدرس 117
دورة لغة CSS

خاصية writing-mode في لغة CSSCSS Writing Mode

سوف تتعلم في هذا الدرس تنسيق النصوص في لغة CSS عن طريق مجموعة خصائص مثل [text-overflow,word-wrap,word-break,writing-mode].

أقسام الدرس
4
الأمثلة
5
اللغة
العربية
تاريخ النشر
غير محدد
المشاهدات
3,780
محتوى الدرس
في هذا الدرس 4تصفّح المواضيع

CSS writing mode خاصية writing-mode في لغة CSS

تستخدم خاصية writing-mode في لغة CSS للتحكم في عرض سطر النص إما أفقياً أو رأسياً.


قيم خاصية word-wrap في لغة CSS:

  • horizontal-tb هي القيمة الافتراضية تجعل المحتوى النصي معروض أفقيًا من اليسار إلى اليمين إذا كان direction:ltr.
  • vertical-rl  تجعل المحتوى النصي عموديًا من أعلى إلى أسفل من جهة اليمين right-left إذا كان direction:ltr.
  • vertical-lr تجعل المحتوى النصي عموديًا من أعلى إلى أسفل من جهة اليسار left-right إذا كان direction:ltr.

CSS writing-mode Syntax

طريقة كتابة خاصية writing-mode في لغة CSS.

HTML
writing-mode:value;

CSS writing-mode values

قيم خاصية writing-mode في لغة CSS.

HTML
writing-mode:horizontal-tb|vertical-rl|vertical-lr;

CSS writing mode horizontal tb خاصية writing-mode مع القيمة horizontal-tb في لغة CSS

تستخدم خاصية writing-mode مع القيمة horizontal-tb في لغة CSS لتجعل المحتوى النصي معروض أفقيًا من اليسار إلى اليمين إذا كان direction:ltr وهي القيمة الافتراضية.

CSS writing mode horizontal tb

خاصية writing-mode في لغة CSS مع القيمة horizontal-tb.

HTML
p
{
  word-wrap: normal;
  background-color:#2196F3;
  color:white;
  width:100px;
  padding:10px;
}

CSS writing mode vertical rl خاصية writing-mode مع القيمة vertical-rl في لغة CSS

تستخدم خاصية writing-mode مع القيمة vertical-rl في لغة CSS لتجعل المحتوى النصي عموديًا من أعلى إلى أسفل من جهة اليمين right-left إذا كان direction:ltr.

CSS writing mode vertical rl

خاصية writing-mode في لغة CSS مع القيمة vertical-rl.

HTML
p
{
  writing-mode:vertical-rl;
  background-color:#2196F3;
  color:white;
  padding:10px;
  height:250px;
}

CSS writing mode vertical lr خاصية writing-mode مع القيمة vertical lr في لغة CSS

تستخدم خاصية writing-mode مع القيمة vertical-lr في لغة CSS لتجعل المحتوى النصي عموديًا من أعلى إلى أسفل من جهة اليسار left-right إذا كان direction:ltr.

CSS writing mode vertical lr

خاصية writing-mode في لغة CSS مع القيمة vertical-lr.

HTML
p
{
  writing-mode:vertical-lr;
  background-color:#2196F3;
  color:white;
  padding:10px;
  height:250px;
}

مشاركة

هل كان هذا الدرس مفيدًا؟

جارٍ تحميل الآراء…

ابنِ لغتك البرمجية

المصطلحات10

راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.

0 / 10 مفهومةأول بطاقة، أول خطوة
01 Text نص
للمراجعة
02 Effects تأثيرات
للمراجعة
03 Overflow زائد / تجاوز
للمراجعة
04 Word كلمة
للمراجعة
05 Wrap لف / كسر
للمراجعة
06 Break استراحة
للمراجعة
07 Writing كتابة
للمراجعة
08 Mode وضع
للمراجعة
09 Keep إحتفظ / إحتفاظ
للمراجعة
10 All الجميع
للمراجعة

اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.

حروف قليلة. معنى كامل.

الاختصارات1

راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.

0 / 1 مفهومةأول بطاقة، أول خطوة
01 CSS CSS
Cascading Style Sheets
صفحات الأنماط الانسيابية
للمراجعة

اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.

مساحة التحدي

اختبر فهمك.
ووصلها للإتقان.

كل سؤال خطوة لقدّام. اختار، اكتب كود، وشوف نتيجتك فورًا.

3أسئلة 1أنواع تحديات 100%هدف الإتقان
تصحيح تلقائي. فرص بلا حدود.

أكمل المهام، واجمع كل الإجابات الصحيحة. أقل من 100%؟ راجع وأعد المحاولة.

الأسئلة متاحة للاطلاع. سجّل الدخول للتفاعل وحفظ تقدمك.

لمحة عن التحدي3 أسئلة تنتظرك
01

تحدد خاصية .............. في CSS كيفية الإشارة الي المحتوي الذي لم يتم عرضه من نص معين

02

تسمح خاصية ............. في CSS للكلمات الطويلة بأن تكون قادرة على كسرها والنزول على السطر التالي.

03

تحدد خاصية .................. في CSS ما إذا كانت أسطر النص تظهر أفقيًا أو رأسيًا.