Увеличение размера текста в классе div

Question

Пожалуйста, помогите мне увеличить размер текста с помощью стиля в следующем коде.

<div class="hidden-overlay"> MASTER CLASS AIR 2.0 TITANIUM </div>

Answer 1

Вы можете попробовать это, добавив модификатор для класса, позволяющий изменить размер шрифта, соответственно, текущий размер шрифта (%, em, rem), или вы можете указать размер c stati, например, 20 пикселей ,

<div class="hidden-overlay hidden-overlay--large-percent"> MASTER CLASS AIR 2.0 TITANIUM </div>
<style>
    .hidden-overlay--large-percent{font-size: 150%}
    .hidden-overlay--large-rem{font-size: 1.5rem}
    .hidden-overlay--large-rem{font-size: 1.5em}
    .hidden-overlay--large-px{font-size: 20px}
</style>

для эффекта наведения

<div class="img-wrapper">
   <img src="some-img.jpg">
   <div class="hidden-overlay <div class="hidden-overlay hidden-overlay--large-percent">MASTER CLASS AIR 2.0 TITANIUM</div>
<div>
<style>
    .img-wrapper:hover .hidden-overlay--large-percent{color: blue}
    .img-wrapper:hover .hidden-overlay--large-rem{color: #00f}
    .img-wrapper:hover .hidden-overlay--large-rem{color: #00f}
    .img-wrapper:hover .hidden-overlay--large-px{color: #00f}
</style>

Answer 2

Одно из решений - просто установить размер шрифта для всего в div следующим образом:

<div class="hidden-overlay" style="font-size: 3em;"> MASTER CLASS AIR 2.0 TITANIUM </div>

Более приятный способ сделать это - сделать текст заголовком, вложив его в h1 ( возможно, попробуйте и h2 или h3)

<div class="hidden-overlay"><h1>MASTER CLASS AIR 2.0 TITANIUM</h1></div>

см. живой образец здесь .

Дополнительное примечание: если вы не хотите, чтобы это css было inline вместо style="font-size: 3em;", вы можете просто применить это css к классу hidden-overlay вот так:

<style>
.hidden-overlay {
  font-size: 2em;
}
</style>

Answer 3

Вы можете попробовать что-то вроде этого: <div style="font-size:40">(insert your text here)</div>

Вы можете изменить размер вместо «40», как хотите.

Answer 4

Поскольку вы хотите сделать это из стиля в предоставленном вами div, вы можете попробовать следующее:

<div class="hidden-overlay" style="font-size: 20px;"> MASTER CLASS AIR 2.0 TITANIUM </div>

style атрибут добавлен в div, в котором вы можете написать обычный css code.

Если вы хотите подать заявку на несколько мест в HTML, вам придется использовать классы CSS.