الانتقال إلى المحتوى الرئيسي

هيكل وخصائص المغلق لتغيير لون الخط وحجمه

يعمل مصممو ومطورو الويب باستمرار على إنشاء مواقع ويب جميلة وسهلة الاستخدام. أحد الجوانب المهمة للتصميم هو اختيار اللون وحجم الخط. المغلق (أوراق الأنماط المتتالية) يوفر خصائص مختلفة لتغيير هذه المعلمات وإنشاء تصميم فعال.

واحدة من خصائص كس الرئيسية لتغيير لون الخط هو خاصية 'اللون'. انها تسمح لك لتعيين لون النص باستخدام اسم اللون ، رمز عرافة ، أو قيم رغب. على سبيل المثال ، يمكنك تعيين لون الخط إلى الأحمر باستخدام الإدخال التالي: 'اللون: الأحمر'.

خاصية كس أخرى لتغيير لون الخط هي خاصية 'لون الخلفية'. يسمح لك بتعيين لون خلفية النص. على سبيل المثال ، يمكنك تعيين خلفية بيضاء من الخط الأزرق باستخدام الإدخال التالي: 'الخلفية-اللون: الأزرق'.

الخاصية 'حجم الخط' يسمح لك بتغيير حجم الخط. يمكن ضبطه بالبكسل أو النسب المئوية أو م أو وحدات القياس الأخرى. على سبيل المثال ، يمكنك تعيين حجم خط 20 بكسل باستخدام الإدخال التالي: 'حجم الخط: 20 بكسل'.

  1. أساسيات هيكل المغلق
  2. طرق لتغيير لون النص
  3. تطبيق لون الخلفية
  4. أحجام الخطوط
  5. تغيير نمط النص باستخدام كس
  6. خصائص لتغيير وزن الخط

أساسيات هيكل المغلق

يستخدم كس القواعد التي تحدد بالضبط كيف يجب عرض عناصر هتمل. تتكون القواعد من محددات وإعلانات النمط.

تحدد المحددات أنماط عناصر هتمل التي يجب تطبيقها عليها. يمكن أن تكون محددات الهوية ومحددات الفئة ومحددات العلامات وغيرها.

تحدد إعلانات النمط بالضبط كيف يجب أن تبدو العناصر المحددة. يتكون كل إعلان من خاصية (على سبيل المثال ، اللون أو حجم الخط) وقيمته (على سبيل المثال ، أحمر أو 14 بكسل).

يمكن كتابة قواعد كس داخل مستند هتمل داخل علامة ، في ملف كس منفصل ، أو جزءا لا يتجزأ من عنصر هتمل باستخدام سمة النمط.

كما يدعم كس الميراث نمط ، والذي يسمح لك لتعيين أنماط لعنصر الأصل وتطبيقها تلقائيا على جميع العناصر التابعة لها.

  • تضمين الأنماط في ملف هتمل:
  • تحديد الأنماط في ملف كس منفصل:
  • الأنماط المضمنة باستخدام النمط:

السمة المغلق هو أداة قوية لخلق مظهر جميل ومنظم من صفحات الويب. مع ذلك ، يمكنك بسهولة تغيير لون النص ، تعيين حجم الخط ، إضافة هوامش وأكثر من ذلك بكثير.

طرق لتغيير لون النص

1. باستخدام اسم اللون:

يمكنك تعيين لون النص باستخدام اسم اللون باللغة الإنجليزية. على سبيل المثال:

اللون: أحمر;

2. باستخدام القيم السداسية العشرية:

يمكن أيضا تعيين لون النص باستخدام قيمة سداسية عشرية. على سبيل المثال:

اللون: # فف0000;

في هذه الحالة ، #ف 0000 هي القيمة السداسية العشرية للون الأحمر.

3. باستخدام وظيفة رغب:

تسمح لك وظيفة رغب بتعيين لون النص عن طريق تحديد قيم القنوات الحمراء والخضراء والزرقاء. على سبيل المثال:

اللون: رغب(255 ، 0 ، 0);

في هذه الحالة ، رغب(255 ، 0 ، 0) هي قيم الأحمر.

يمكنك أيضا استخدام وظيفة رغبا ، والذي يسمح لك لتعيين لون النص عن طريق تحديد قيم القناة والشفافية. على سبيل المثال:

اللون: رغبا (255 ، 0 ، 0 ، 0.5);

هنا ، رغبا(255, 0, 0, 0.5) — هذه هي قيم اللون الأحمر الشفاف.

4. استخدام الكلمات الرئيسية:

يحتوي كس أيضا على كلمات رئيسية متاحة لتغيير لون النص. على سبيل المثال ، يمكنك استخدام "وراثة" لترث اللون من العنصر الأصل ، أو "كيرنتكولور" لتعيين اللون المحدد لخاصية "اللون" للعنصر الأصل.

لاحظ أنه لكل طريقة لتغيير لون النص ، يمكنك استخدام خاصية" اللون".

الآن أنت تعرف عدة طرق لتغيير لون النص ، ويمكنك استخدام هذه المعرفة لتصميم صفحة الويب الخاصة بك.

تطبيق لون الخلفية

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

لتعيين لون الخلفية ، يمكنك استخدام أشكال مختلفة من نموذج اللون: أسماء الألوان ، رموز عرافة ، قيم رغب.

مثال على استخدام اسم اللون:

بناء الجملةمثالالنتيجة
لون الخلفية: اسم اللون;لون الخلفية: أحمر;

مثال على استخدام رمز عرافة:

بناء الجملةمثالالنتيجة
لون الخلفية: # رمز عرافة;لون الخلفية: #0000;

مثال على استخدام قيمة رغب:

بناء الجملةمثالالنتيجة
لون الخلفية: رغب (قيمة_ر ، قيمة_ز ، قيمة_ب);لون الخلفية: رغب (0 ، 255 ، 0);

يمكن تعيين لون الخلفية لعناصر هتمل المختلفة ، مثل الفقرات والعناوين والفقرات ، إلخ. يتيح لك ذلك إنشاء تصميمات صفحات ويب مثيرة للاهتمام وأنيقة.

أحجام الخطوط

هناك عدة طرق لتعيين حجم الخط في كس:

وحدة القياسالوصف
من بكسلحجم ثابت بالبكسل. على سبيل المثال,
م تعيين حجم الخط إلى 20 ٪ أكبر من العنصر الأصل.
ريم تعيين حجم الخط إلى 50 ٪ أكبر من العنصر الجذر.
فولكس فاجن ، ف، فمين، فماكس يحدد حجم الخط يساوي 5٪ من عرض نافذة المتصفح.

فمن المستحسن استخدام وحدات القياس النسبية (إم ، ريم ، فولكس فاجن ، ف ، فمين ، فماكس) لإنشاء تصميم التكيف.

تغيير نمط النص باستخدام كس

أوراق الأنماط المتتالية (كس) لديها العديد من الخصائص التي تسمح لك لتغيير نمط النص من صفحة ويب. باستخدام كس ، يمكنك تعيين اللون وحجم الخط والمحاذاة والخصائص الأخرى للنص. هذا يجعل من الممكن إنشاء تصميم جميل وفريد لكل صفحة ويب.

، مما يسمح لك بتعيين لون النص. لتغيير لون النص إلى الأصفر ، يمكنك استخدام قاعدة كس التالية:

ف { اللون: أصفر؛}

وبالمثل ، يمكنك تعيين أي لون آخر عن طريق تحديد الرمز أو الاسم أو قيمة رغب:

ف {اللون: # ف 0000؛}

، الذي يحدد حجم الخط. لتعيين حجم الخط إلى 16 بكسل ، يمكنك استخدام قاعدة كس التالية:

ف { حجم الخط: 16 بكسل؛}

يمكن تحديد حجم الخط بالبكسل أو النسب المئوية أو وحدات القياس الأخرى.

بالإضافة إلى ذلك ، يمكنك استخدام كس لتغيير تباعد الأسطر ومحاذاة النص ونمط الخط والظلال والمزيد. تسمح لك كل هذه الخصائص بتعيين نمط النص بشكل أكثر مرونة وإنشاء تأثيرات على صفحات الويب.

باستخدام كس ، يمكنك إنشاء أنماط نص فريدة وجذابة من شأنها أن تساعد في التأكيد على أهمية أجزاء معينة من المحتوى ، وجعل النص أكثر قابلية للقراءة ، أو إضافة جاذبية جمالية لصفحة الويب الخاصة بك.

خصائص لتغيير وزن الخط

كس لديها العديد من الخصائص التي تسمح لك لتغيير وزن الخط من النص. يحدد وزن الخط تشبع وسمك الحروف.

. يمكنك استخدام هذه الخاصية لتعيين خط رفيع أو عادي أو غامق أو غامق.

:

القيمةالوصف
عاديالخط العادي (القيمة الافتراضية)
جريئةخط غامق
أكثر جرأةحتى أكثر جرأة الخط أخف وزنا
خط أرق
100-900القيم الرقمية لتعيين وزن الخط التعسفي

يساعد على إنشاء التأثير المرئي المطلوب وإبراز نص معين على الصفحة.