يحدد حجم الخط للعنصر. يمكن ضبط الحجم بعدة طرق. مجموعة من الثوابت (xx-صغير، x-صغير، صغير، متوسط، كبير، x-كبير، xx-كبير) تحدد الحجم الذي يسمى المطلق.
في الحقيقة، فهي ليست مطلقة تمامًا، لأنها تعتمد على إعدادات المتصفح ونظام التشغيل.
تقوم مجموعة أخرى من الثوابت (الأكبر والأصغر) بتعيين أحجام الخطوط النسبية. نظرًا لأن الحجم موروث من العنصر الأصلي، يتم تطبيق هذه الأحجام النسبية على العنصر الأصلي لتحديد حجم الخط للعنصر الحالي.
في النهاية، يعتمد حجم الخط بشكل كبير على قيمة خاصية حجم الخط الخاصة بالعنصر الأصلي.
يتم تعريف حجم الخط نفسه على أنه الارتفاع من خط الأساس إلى أعلى الدبوس، كما هو موضح في الشكل. 1.
بناء الجملة
قيم
لتعيين الحجم المطلق، يتم استخدام القيم التالية: xx-small، x-small، صغير، متوسط، كبير، x-large، xx-large.
يتم عرض مراسلاتها مع حجم الخط في HTML في الجدول. 1.
يتم تحديد حجم الخط النسبي بالقيم الأكبر والأصغر.
يُسمح أيضًا باستخدام أي وحدات CSS صالحة: em (ارتفاع خط العنصر)، ex (ارتفاع الحرف x)، النقاط (pt)، البكسل (px)، النسب المئوية (٪)، وما إلى ذلك. حجم خط العنصر الأصلي هو يؤخذ على أنه 100٪. القيم السلبية غير مسموح بها.
حجم الخط
Duis te fugifacilisi Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem Nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.من الحكمة أن نقوم بالحد الأدنى من التمارين التي نمارسها في ullamcorper ولا نرغب في الحصول على أي شيء من أي شيء يترتب على ذلك.
نتيجة
يظهر في الشكل. 1.
نموذج الكائن
document.getElementById("elementID").style.fontSize
لنعد الآن إلى فصلنا؛ يتم استخدام علامة الحاوية لتنفيذ جميع هذه الوظائف المذكورة في العنوان.
الآن دعونا نعود إلى موضوعنا.
من أجل تغيير حجم أو خط أو لون نص قسم منفصل في HTML، هناك علامة حاوية قطعة منفصلة من النص
لنبدأ بالترتيب ونتعرف على كيفية تغيير لون نص قسم منفصل لهذا الغرض في علامة الخطتحتاج إلى وضع السمة لونمثله:
اللون = "الأحمر"> قطعة منفصلة من النصقيم السمات لونكما هو الحال بالنسبة لسمات النص bgcolor لعلامة الجسم، أي يمكننا تحديدها بكلمات باللغة الإنجليزية (أسود، أخضر، فضي، ليموني، رمادي، زيتوني، أبيض، أصفر، كستنائي، بحري، أحمر، أزرق، أرجواني، أزرق مخضر) ، فوشيا، أكوا) أو أرقام الألوان في RGB (#000000- #FFFFFF)
الوجه = "تاهوما"> قطعة منفصلة من النصتعمل الخطوط على جعل النص يتمتع بمظهر أكثر استثنائية، ولكن هناك مشكلة واحدة، وهي أن الخطوط التي لديك (يمكنك مشاهدتها في C:WINDOWSFonts) قد لا تكون متاحة لزوارك، والمشكلة الثانية في الخطوط هي أن بعض الخطوط لا يمكن استخدامه إلا باللغة السيريلية (الحروف الروسية) أو العكس فقط مع الأبجدية اللاتينية (الحروف الإنجليزية)، وهناك بالطبع نوع ثالث مناسب لكل من الأبجدية اللاتينية والسيريلية. سأعرض في القائمة السفلية الخطوط القياسية والمتوفرة على جميع أجهزة الكمبيوتر والتي تناسب أيضًا أي أحرف:
الآن دعنا ننتقل إلى الأحجام، يمكنك تغيير حجم النص في HTML باستخدام علامتين الخطو/أو باسفونت.
لنبدأ مع باسفونت، يتم استخدام هذه العلامة لتغيير اللون الأساسي والخط وحجم النص، على سبيل المثال:
هذه العلامة ليست حاوية، أي. ليس لديه علامة خلفية. يتم تعيين لون وخط النص كما في العلامة الخطولكن لتغيير حجم النص يتم استخدام السمة مقاسبقيمة من 1 إلى 7. يمكن استخدام هذه العلامة عدة مرات في النص:
بشكل افتراضي، حجم النص = "3"، لا يمكن تحديد هذا الحجم. في المثال الأول قمنا بزيادة النص بمقدار واحد، وفي السطر الثاني قمنا بزيادته إلى "6"، وفي الثالث قمنا بإعادته إلى النص الافتراضي مرة أخرى.
الآن أريد أن أخيب ظنك، فقد تم تقديم هذه العلامة في الإصدار HTML-4.01، وبناءً على ذلك، يتم دعم Internet Explorer فقط في المتصفح، بينما تتجاهلها المتصفحات الأخرى ببساطة، لذا فمن الأفضل عدم استخدام هذه العلامة على الإطلاق!!!
واستخدم العلامة فقط الخط مع سمة الحجموهو مدعوم من قبل جميع المتصفحات تقريبًا. سمة الحجم، يأخذ أيضًا القيم من 1 إلى 7، ولكن يمكن أيضًا تحديد هذه الأحجام من "-2" إلى "+4"
نص
نص
نص
نص
نص
نص
نص
يمكن أن تحتوي علامة FONT، مثل BASEFONT، على عدة سمات:
الحجم = "5" اللون = "الأحمر" Fase = "تاهوما، تايمز، فيردانا">....نص....
تحياتي لجميع قراء هذا المقال والمشتركين في مدونتي! أريد أن أخصص منشور اليوم لموضوع دون معرفة أن موارد الإنترنت الخاصة بك لن تكون قابلة للقراءة وجذابة: "كيفية تعيين خط في HTML". الموضوع في حد ذاته سهل وأنا متأكد من أنك ستتقنه بسرعة.
ومع ذلك، لا ينبغي لنا أن ننسى أن لغات الويب غنية بجميع أنواع أدوات تصميم الخطوط التي تحتاج إلى معرفتها بشكل مثالي. بعد قراءة المقالة، ستتقن تنسيق النص بثقة، وتتعلم كيفية تعيين أنماط مختلفة وأنواع أنماط الخطوط والزخارف، بالإضافة إلى تغيير حجم ولون الجمل والحروف الفردية. دعونا نبدأ!
يستخدم الجزء الأكبر من اللافتات والصحافة والأدب والمواقع الإلكترونية والخدمات الأخرى الخطوط القياسية. على الرغم من أنها مريحة، إلا أنها أصبحت مملة لفترة طويلة ولا تلفت الأنظار. هذا هو السبب وراء قيام العديد من المصممين بتغيير نوع التصميم قليلاً أو إنشاء أنماط جديدة تمامًا. الخطوط الأكثر شهرة وتأثيرا هي:
تكمن اختلافاتهم الرئيسية في علاقتهم بعائلات معينة. هناك عائلات serif (serif)، وsans serif، وزخرفية، ومائلة، وأحادية المسافة.
أريد أيضًا التأكيد على أن هناك 5 أحجام للخطوط.
هنا يقع أولاًفقرة حاضِرمثال. من أجل الوضوح هذه الكلماتسيتم كتابتها بالخط المائل.
اسمحوا لي أن أذكركم أن السمة محاذاة = "مركز"يضبط النص الذي سيتم عرضه في المركز.
على الرغم من المجموعة الكاملة من العلامات المتنوعة التي يوفرها HTML، فإن CSS هي أداة أكثر ملاءمة ومرونة لتصميم مظهر الخطوط.
الخصائص الرئيسية المستخدمة لتنسيق المحتوى هي: الخطومكوناته: زخرفة النص.
دعونا ننظر إليها أولا الخط. هذا المعلمة العالمية، والتي بفضلها يمكنك تعيين عدة قيم في نفس الوقت. وبالإضافة إلى ذلك، تعمل كل معلمة مع الكلمات الرئيسية الخاصة بها.
اسم العقار | الكلمات الرئيسية |
عائلة الخط | يمكن تثبيتها كعائلات خطوط قياسية: · بدون الرقيق (بلا الرقيق)؛ · العتيقة (رقيق)؛ · ديكور (خيال) ؛ · مائل (مخطوطة)؛ · الفضاء الأحادي (أحادي الفضاء)، وكذلك هي الأنماط القياسية الموجودة (Arial، Calibri، وما إلى ذلك). |
حجم الخط | لتعيين الحجم المطلق للرموز، يتم استخدام الرموز التالية: xx-small، x-small، صغير، متوسط، كبير، x-large، xx-large. يمكنك أيضًا تحديد قيمة فريدة. |
وزن الخط | المسؤول عن تشبع نمط النص. يتم تحديد التغييرات في النطاق باستخدام الكلمات عادي أو غامق أو أخف أو أكثر جرأة. |
متغير الخط | يحدد تمثيل الحروف باستخدام الكلمات الرئيسية: الأحرف الصغيرة، عادية أو ترث. |
نمط الخط | يضبط الأصل العادي أو المائل أو المائل أو يرث الأصل. |
امتداد الخط | يدل على كثافة الحروف. يمكن تحديد القيم التالية: فائق التكثيف، فائق التوسيع، شديد التكثيف، شديد التوسيع، شبه مكثف، شبه موسع، عادي، موسع، مكثف، وارث. |
ملكية زخرفة النصيساعد على تزيين النص بعناصر إضافية مثل التسطير ( تسطير)، يتوسطه خط ( من خلال الخط)، خط علوي ( خط فوقي)، ويرث أيضًا معلمات الأصل ( يرث) أو إلغاء كل التسجيل ( لا أحد).
والآن حان الوقت للمثال الثاني. لقد أخذت الكود السابق وقمت بتصميمه باستخدام CSS. لذلك، تم تزيين العنوان بالظل (باستخدام الخاصية نص-الظل) ومع مخطط تفصيلي حول ( حدود-لون). وفي الوقت نفسه، قمت بتكبير كلمة واحدة. أردت أيضًا استخدام المعلمة العتامةلتعيين شفافية العنوان الفرعي.
هنا يقع أولاًفقرة حاضِرمثال. من أجل الوضوح هذه الكلماتسيتم كتابتها بالخط المائل.
أو دراسة العلامات التي تقوم بتنسيق نص HTML
نقدم انتباهكم إلى أحد أهم وأبسط الدروس في البرنامج التعليمي.
انظر أدناه العلامات التي تقوم بتنسيق نص HTML:
→ أحادي المسافة نص HTML(الخط أحادي المسافة).النتيجة: ... خط أحادي المسافة
النتيجة: ...حجم الخط أكبر من المعتاد
نتيجة: ... الخط المائل
النتيجة: نص يتوسطه خط (خط يتوسطه خط)
النتيجة: مرتفع
يجب استخدام تقنيات التنسيق الموضحة أعلاه فقط لأجزاء صغيرة من النص. استخدمه CSSإذا كنت تريد تعيين خط معين للصفحة بأكملها، أو لعدة أسطر، على سبيل المثال.
بالإضافة إلى استخدام أحجام الخطوط وأنماطها القياسية (المحارف)، يمكنك تحديد الخطوط لكل جزء من النص باستخدام علامات خاصة. أسهل طريقة هي استخدام ما يسمى الأنماط الجسدية:
لكل علامة نمط فعلية، توجد علامة إغلاق مقابلة تعمل على تعطيل التطبيق الإضافي للنمط. على سبيل المثال، للعلامة علامة الإغلاق هي.
فيما يلي مثال للبرنامج و مظهرأنماط جسدية مختلفة:
<НЕАD><ТIТLЕ>الأنماط الجسديةТIТLЕ>НЕАD>
<В>عريضВ>
مائل
وشدد
شطب
<ТТ>آلة كاتبةТТ>
<ВХ1>مائل غامقВ>
<ВХ1><и>تم وضع خط تحته خط مائل غامقВ>
أرز. 649. الأنماط الجسدية
يمكنك إدراج علامة نمط فعلية داخل علامة عنوان لتعديل العنوان بالكامل أو جزء منه فقط. على سبيل المثال، لوضع خط مائل على جزء من النص المحدد كعنوان، يمكنك استخدام البنية التالية:
<НЕАD><ТIТLЕ>الأساليب المادية والمنطقيةТIТLЕ>
НЕАD>
<Н2>هذا - معدلرأس المستوى الثانيН2>
أرز. 650. تغيير نمط الخط لجزء من العنوان
باستخدام علامة خاصة
يمكنك تخصيص الخط للصور النصية: اضبط الخط والحجم واللون. أولا، يمكنك ضبط حجم الخط الرئيسي المستخدم في المستند بشكل افتراضي. علامة الخط الرئيسي لها التنسيق
علامة
لتعيين محرف الخط، استخدم العلامة
. على سبيل المثال:
إذا لم يتم استخدام هذه العلامة في مستندك، فسيستخدم المتصفح مجموعة الخطوط حسب تفضيلاته. لذلك، قد يبدو النص الموجود على شاشة المستخدم مختلفًا تمامًا عما تخيلته. يجب عليك أيضًا أن تضع في اعتبارك أنه إذا لم يتم تثبيت الخط الذي قمت بتعيينه على جهاز الكمبيوتر الخاص بالمستخدم، فسيعرض المتصفح النص بالخط الافتراضي.
يمكنك في العلامة
تشير إلى قائمة الخطوط مفصولة بفواصل. في هذه الحالة، سيستخدم المتصفح الخط الأول الذي تم العثور عليه. على سبيل المثال، يمكنك كتابة علامة:
FACE="Arial، Sans Serif، Courier">
عادةً، يتم تحديد الخطوط المشابهة في القائمة. يوصى بتعيين الخطوط الأكثر شيوعًا. عند وضع معلومات نصية على الصفحة، من الأفضل عدم تعيين اسم خط على الإطلاق، وذلك بالاعتماد على إعدادات المتصفح القياسية. ولكن بعد ذلك، عند تصميم الصفحة، يجب عليك أيضًا استخدام إعدادات المتصفح القياسية لمزامنة تصورك للنص مع التصور المحتمل للمستخدم. ففي النهاية، أنت تقوم بإنشاء صفحة ليس لنفسك، بل لقرائك.
استخدام سمة اللون على العلامة
يمكنك ضبط لون الخط:
وسيطة سمة اللون هي تمثيل سداسي عشري لرمز اللون (المكونات الحمراء والخضراء والزرقاء، المعروفة أيضًا باسم مكونات RGB).
<НЕАD><ТIТLЕ>يوضح البرنامج التالي إدارة الخطوط:ТIТLE/НЕАD>
<Р>تثبيت الخطوط الخط اريا
<Р>ABVGDEZHIK الخط البريدي
<Р>ABVGDEZHIK الخط البريدي
رمز الخط
أرز. 651. استخدام الخطوط المختلفة لاحظ ذلك في العلامة
يمكنك استخدام بعض أو كل سماته الممكنة. على سبيل المثال: فيالصيغ الرياضية ، بالإضافة إلى الحواشي السفلية، غالبًا ما تستخدم الفهارس التي تختلف عن النص الرئيسي في الموضع (أعلى أو أقل قليلاً) والحجم. العلامات تخدم هذا الغرض و
<НЕАD><Т1ТLЕ>على التوالي للمؤشرات العلوية والسفلية.ТIТLЕ>الفهارس
<НЗ>/الرأس>
<Р>مثال على استخدام الفهارس 2)(5+س
س+3 1أ 2+أ 3
<Р>+أ 2
الحواشي
بالإضافة إلى تلك التي تمت مناقشتها أعلاه، هناك علامات تنسيق نص إضافية:
,
- تسجيل نصوص البرامج والثوابت الرمزية.تستخدم الأنماط الثلاثة الأخيرة خطًا أحادي المسافة (عادةً Courier).
على سبيل المثال، يشغل الحرفان I وZ في الخط أحادي المسافة نفس المساحة. يرجع استخدام الخطوط أحادية المسافة إلى سهولة محاذاة النص باستخدام أحرف المسافات.دعونا نلاحظ نقطة أخرى. يمكن أن تتضمن علامات التحكم في الخط، مثل علامات النمط المنطقي، السمة العنوان = "سلسلة"، والذي يسمح لك بإرفاق تلميح أداة بالنص الموجود داخل هذه العلامة.