Ж К П
В любом текстовом процессоре (Microsoft Word, Google Docs, LibreOffice) кнопки "полужирный", "курсив" и "подчеркнутый" находятся рядом:
Десятилетиями в голове устаканивался паттерн о том, что это свойства одного порядка. Хочешь сделать полужирный курсив, нажимаешь две кнопки рядом:
Хочешь жирный и подчеркнутый:
Про подчеркнутый курсив не буду - это для особенных людей.
В HTML-тегах с этим тоже просто. Есть три тега: b, i и u. Можно вкладывать их друг в друга и получать желаемую комбинацию:
<b><i>полужирный курсив</i></b> <b><u>полужирный подчеркнутый</u></b> <i><u>пожалуйста, не надо</u></i>
А в CSS это совершенно разные свойства:
{
/* полужирный */
font-weight: bold;
/* курсив */
font-style: italic;
/* подчеркнутый */
text-decoration: underline;
}
Про font-weight еще более-менее понятно, но правила применения двух остальных свойств я уже 13 лет не могу запомнить. Если нужно сделать подчеркнутый текст, а подсказок взять негде, я могу просто перебрать все варианты, пока не заработает:
text-style: underline;
font-style: underline;
font-decoration: underline;
text-underline: true;
Очень бесит. Хочется либо так:
font-style: bold;
font-style: bold, italic;
font-style: italic, underline;
Либо так:
font-bold: true;
font-underline: true;
font-italic: true;
Большего мне и не надо.