Есть ли семантический способ DEemphasize текста с помощью html и css?

Обычно я делаю это в HTML(5) следующим образом:

/* CSS For this example */
footer p {
font-size: 16px;
font-weight: normal;
}

footer strong {
font-weight: bolder;
}

<!-- HTML for this example -->
<footer>
  <p>Title <strong>- Name. 1234 N. Main St., Anytown, USA</strong></p>
</footer>

Моя проблема с этим заключается в том, что кажется, что 90% текста в абзаце имеет большее значение, что кажется мне нелогичным. Мне кажется более семантичным обернуть в абзац только ненормальный текст, который в данном случае является текстом с меньшим весом, и оставить footer p {font-weight:bold}.

Является ли <small> подходящим элементом здесь, хотя на самом деле это не правовая оговорка и т. д.


html css semantic-markup
person Miles Carmany    schedule 15.09.2011    source источник

Ответы (2)


arrow_upward
7
arrow_downward

Да, в вашем случае <small> является подходящим элементом, хотя он не "декламирует" текст.

Строки из текущих спецификаций html:

Примечание. Мелким шрифтом обычно указываются заявления об отказе от ответственности, предостережения, юридические ограничения или авторские права. Мелкий шрифт также иногда используется для указания авторства или для выполнения лицензионных требований.

Примечание. Элемент small не «преуменьшает» и не снижает важность текста, выделенного элементом em или помеченного как важный элементом strong. Чтобы пометить текст как невыделенный или важный, просто не выделяйте его элементами em или strong соответственно.

http://www.w3.org/TR/html5/text-level-semantics.html#the-small-element

person v42    schedule 15.09.2011

arrow_upward
1
arrow_downward

Обычный цвет шрифта — черный (#000). Настройка цвета на более светлый вариант снизит выделение фрагмента текста.

Strong — это тег для выделения текста, поэтому я предлагаю вместо него использовать <small>.

footer small {
    color: #999;
}

Результат: http://jsfiddle.net/rzHgW/

person Rob W    schedule 15.09.2011