شاخص نسبت به متن، جابجایی کاراکترها نسبت به خط مبنا به بالا یا پایین است. بسته به مقدار مثبت یا منفی افست، شاخص به ترتیب بالا یا پایین نامیده می شود. آنها به طور فعال در ریاضیات، فیزیک، شیمی و برای تعیین واحدهای اندازه گیری استفاده می شوند. HTML دو عنصر را برای ایجاد یک شاخص ارائه می دهد: ^{(از حروف انگلیسی) - رونوشت و _{(از زیرنویس انگلیسی) - شاخص پایین تر. متن قرار داده شده در یکی از این کانتینرها کوچکتر از متن اصلی تعیین می شود و نسبت به آن به سمت بالا یا پایین قرار می گیرد. مثال 1 نشان می دهد اشتراک گذاریعناصر و سبک های مشخص شده برای تغییر ظاهر متن.}}

مثال 1: ایجاد یک زیرنویس و یک زیرنویس

معادله مشخصه سطح درجه دوم

λ ³-من ₁λ ²+من ₂λ - من ₃ = 0

در مثال، هر دو زیرنویس و بالا به طور همزمان ظاهر می شوند. برای تغییر سبک فونت فهرست، از سبک هایی استفاده می شود که یک طرح یکنواخت را تعیین می کنند (شکل 1).

برنج. 1. نمایش شاخص ها پس از اعمال سبک ها

می توانید استفاده از آن را به طور کامل متوقف کنید ^{و _{به نفع سبک ها آنالوگ این عناصر ویژگی vertical-align است که باعث می شود متن با فاصله مشخصی به صورت عمودی جابجا شود. به طور خاص، در مثال 2 مقدار 0.8em برای بالانویس و -0.5em برای زیرنویس است. Em یک واحد نسبی برابر با اندازه فونت فعلی است. به عنوان مثال، 0.5em نشان می دهد که متن باید به اندازه نصف اندازه فونت جابجا شود.}}

مثال 2: استفاده از سبک ها برای مدیریت شاخص ها

چند جمله ای درجه n

f(x) = a 0+ الف 1 x + ... + a n-1 x n-1+a n x n

در مثال، خود فرمول در یک اندازه بزرگ نمایش داده می شود، نمادهای بالا به رنگ قرمز و نمادهای پایین به رنگ آبی تنظیم شده اند (شکل 2).

سلام. گاهی اوقات هنگام ایجاد صفحات وب لازم است چند کلمه با آن مشخص شود با استفاده از cssحروف بزرگ یا بزرگ بیایید ببینیم چگونه انجام می شود.

حروف بزرگ و کوچک با استفاده از css

به طور کلی حتی امروزه نیز می توانید متن مورد نظر را در تگ ها قرار دهید _{^{و نمایشگر مورد نظر خود را دریافت کنید، اما بیایید ببینیم چگونه می توان با استفاده از css این کار را انجام داد زیرا تکنیک کمی متفاوت است.}}

به عنوان مثال، شما باید فرمول H 2 O را در یک سند html بنویسید. این کار به این صورت انجام می شود:

• خود فرمول نوشته شده است
• آن دسته از کلمات و اعدادی که باید در فهرست بالا یا پایین نمایش داده شوند در یک تگ span قرار می گیرند که باید به آن کلاس اختصاص داده شود. به عنوان مثال: کاراکترهایی که باید خروجی شوند
• در css باید این عنصر را تنظیم کنید:

  فهرست برتر(
  تراز عمودی: فوق العاده;
  }

این ویژگی وظیفه تراز عمودی متن را بر عهده دارد. مقدار آن super مشخص می کند که متن به صورت فوق نویس نمایش داده می شود. اما اندازه فونت مانند متن معمولی باقی ماند. برای اینکه همه چیز زیباتر به نظر برسد، باید اندازه فونت را نیز با استفاده از ویژگی font-size کمی کوچکتر تنظیم کنید.

این اموال به سادگی کار می کند. بر این اساس، برای خروجی در زیرنویس باید به صورت زیر بنویسید:

فهرست برتر(
Vertical-align: sub;
}

تفاوت تگ‌های HTML مشابه این است که این قوانین اندازه فونت را تغییر نمی‌دهند، بنابراین در صورت نیاز به انجام این کار، باید اندازه جدیدی را در شیوه نامه بنویسید.

این تمام چیزی است که باید در مورد superscript و subscript در css بدانید. هیچ کدام ویژگی های اضافیملک فراهم نمی کند و به آنها نیازی نیست. در صورت تمایل می توانید این متن را به شکلی خاص مرتب کنید، اما به ندرت لازم است.

جایی که ممکن است به کارتان بیاید

هنگام نوشتن فرمول ها، اضافه کردن یادداشت ها و یادداشت ها به مقالات می توان از متن زیرنویس و زیرنویس استفاده کرد. برای مثال، ویکی‌پدیا منابع و یادداشت‌هایی را برای هر مقاله ارائه می‌کند. همانطور که مقاله پیشرفت می کند، آنها به صورت بالانوشت های کوچک قرار می گیرند. این کار خوانندگان را آزار نمی دهد و در عین حال به شما امکان می دهد به مقالات ظاهر دلخواه را بدهید.

این ویژگی کاملاً متقابل مرورگر است و در تمام نسخه های CSS پشتیبانی می شود.

تگ های HTML _{و ^{- متن زیرنویس و بالانویس}}

تعریف و استفاده

برچسب بزنید _{متن بین خطی را تعریف می کند. متن زیر خطی نصف ارتفاع است و زیر خط مبنا ظاهر می شود. هنگام نوشتن فرمول های شیمیایی مانند H 2 O می توان از متن بین خطی استفاده کرد.}

برچسب بزنید ^{متن بالا را تعریف می کند. متن بالانویس نصف ارتفاع است و بالای خط پایه ظاهر می شود. هنگام نوشتن پاورقی مانند WWW می توان از متن فوق اسکریپت استفاده کرد.}

پشتیبانی از مرورگر

برچسب ها _{و ^{توسط تمام مرورگرهای اصلی پشتیبانی می شود.}}

تفاوت بین HTML و XHTML

ویژگی های استاندارد

ستون DTDمشخص می کند که در کدام نوع سند ویژگی HTML 4.01/XHTML 1.0 DTD مجاز است. S=Strict، T=Transitional و F=Frameset.

برچسب ها _{و ^{از ویژگی های استاندارد زیر پشتیبانی می کند:}}

اطلاعات بیشتر در مورد ویژگی های استاندارد.

ویژگی های رویداد

برچسب ها _{و ^{از ویژگی های رویداد زیر پشتیبانی کنید:}}

اطلاعات بیشتر در مورد

اکنون چندین درس است که با قالب‌بندی متن با استفاده از CSS پیچیده‌تر شده‌ایم و این بار در حال یادگیری نحوه تغییر حروف متن هستیم. در این راستا، شیوه نامه های آبشاری امکانات بسیار گسترده ای را برای ما باز می کنند و به طور دقیق تر، می توانیم:

• نمایش تمام متن با حروف بزرگ؛
• تمام متن را با حروف کوچک انتخاب کنید.
• دقت کنید که حرف اول هر کلمه با حروف بزرگ شروع شود.

"البته این همه خوب است، اما چه زمانی ممکن است نیاز باشد؟" - شما بپرسید بیایید شرایطی را تصور کنیم که در آن باید تمام آیتم های منو را با حروف بزرگ نمایش دهید. برای انجام این کار، نیازی به تایپ آنها، از جمله کلید CapsLock یا در حالی که دکمه Shift را نگه دارید، ندارید. کافی است تمام آیتم های لیست را با ایجاد یک قانون مربوطه در فایل CSS برای نمایش با حروف بزرگ تنظیم کنید. و این تنها یکی از بسیاری از موقعیت های ممکن است.

ویژگی تبدیل متن

ما حروف متن را با استفاده از ویژگی text-transform کنترل می کنیم. دارای 4 مقدار اصلی - بزرگ (حروف بزرگ)، حروف کوچک (حروف کوچک)، بزرگ (حروف بزرگ برای هر حرف اول کلمه، مقادیر دیگر تغییر نمی کنند)، هیچ (قالب بندی اعمال نمی شود) . در نگاه اول، همه اینها ممکن است برای شما بسیار پیچیده به نظر برسد.

اما در عمل همه چیز بسیار ساده است، همانطور که اکنون خواهید دید. نکته اصلی این است که انتخابگر مناسب را انتخاب کنید، زیرا مقادیر ویژگی تبدیل متن به ارث می رسد.

بزرگ کردن

اول از همه، من پیشنهاد می کنم تمام متن ها را با حروف بزرگ تنظیم کنید، که برای آن قانون CSS زیر را ایجاد می کنیم:

متن (تبدیل متن: بزرگ؛ )

در اصل، هیچ چیز پیچیده ای نیست، ما فقط از مقدار بزرگ استفاده کردیم. همانطور که می گویند، همه چیز شهودی است. این چیزی است که در زندگی واقعی به نظر می رسد:

حروف کوچک - برای همه اعمال شود

گام بعدی این است که با نوشتن موارد زیر، حروف کوچک را در همه جا اعمال کنید:

متن (تبدیل متن: حروف کوچک؛ )

همانطور که احتمالاً قبلاً حدس زده اید، دو معنایی که اخیراً با آنها آشنا شدیم تا حدی متضاد هستند. و در تصویر زیر نتیجه ملک تازه ایجاد شده را مشاهده می کنید.

حرف اول هر کلمه را بزرگ بنویسید

برای انجام این کار، فقط باید از مقدار مربوطه استفاده کنیم:

متن (تبدیل متن: بزرگ کردن؛ )

نمی‌دانم هر چند وقت یک‌بار از چنین قانون CSS استفاده می‌کنید، اما دانستن چنین امکانی به شما آسیبی نمی‌زند، مخصوصاً هنگام حل مشکلات غیر ضروری. نتیجه در تصویر زیر قابل مشاهده است.

در نهایت، اجازه دهید نگاهی گذرا به آخرین مقدار بیاندازیم - هیچ کدام. همانطور که قبلاً گفتم، می توان از آن برای لغو ارث از والدین استفاده کرد. به عنوان مثال، بیایید تصور کنیم که همه قوانین قبلی در حال اجرا هستند و برای پاراگراف ها باید آنها را لغو کنیم، برای این کار موارد زیر را می نویسیم:

P (تبدیل متن: هیچ؛ )

من جرات می کنم فرض کنم همه چیز برای شما روشن است، اگر نه، سوالات خود را در نظرات بپرسید. و این همه برای من است. امیدوارم این آموزش CSS برای شما مفید بوده باشد. اگر چنین است:

• بازنشر این مقاله در شبکه های اجتماعیبه طوری که افراد بیشتری از آن بهره مند شوند.
• در خبرنامه من مشترک شوید تا پست های مفید و جالب وبلاگ را از دست ندهید.

اینجاست که من با شما خداحافظی نمی کنم. با تشکر از توجه شما و شما را در انتشارات بعدی می بینم!