Разве шрифт 3em не должен быть такого же размера, как 3em div?

Question

Это мой код: http://jsbin.com/ziwafeyari/1/edit?html,css,output

Разве div не должен быть того же размера, что и текст? Я знаю, что это не конкретные значения, они относятся к чему-то, но к чему? Отличается ли размер em файлом.css или каждым тегом (div/p/ol/ul)?

Спасибо

Answer 1

• 10px +.5em = 5px
• 10px + 1em = 10px
• 10px + 2em = 20px
• 10px + 50% = 5px
• 10px + 100% = 10px
• 10 пикселей + 200% = 20 пикселей

.standard-size {
    font-size: 30px;
}

.standard-size-resized-with-em {
    font-size: .5em;
}

.standard-size-resized-with-percentage {
    font-size: 50%;
}

<div class="standard-size">
    My text is 30px! <br />
 <span class="standard-size-resized-with-em" style="">My text is 15px!</span>
</div>

<div class="standard-size">
    My text is 30px! <br />
 <span class="standard-size-resized-with-percentage" style="">My text is 15px!</span>
</div>

http://jsfiddle.net/v0Ladkun/5/

Answer 2

em будет наследовать размер шрифта своего родителя. Так что если размер шрифта 1pt, 1em = 1pt, 2em = 2pt, Если вы не установили размер шрифта, по умолчанию это 12pt или 16px. Так что значение по умолчанию em 12pt. Может отличаться в других элементах HTML.

Для более подробной информации о emПосетите эту ссылку.

Удачи!

Answer 3

1em - относительный размер буквы "m" в текущем шрифте. Отсюда "эм", понимаешь?