• Обычно используют тег <span>
для работы с текстом. У блоков div
по умолчанию стоит display: block;
- который переносит их на отдельную строку и дает ширину 100%. Они будут вести себя как span, если задать display: inline;
• CSS позволяет вынести все стили из HTML в отдельное место. Так легче работать с кодом, особенно если у вас будет много таких подкрашенных кусков. Каждый раз достаточно будет добавлять на элемент класс с нужной краской, а не весь код. Это дело добавляется где-то вверху страницы, внутри <style> тега, здесь </style>
• Цвет вида #aa33bb
можно сократить до #a3b
Пример:
.hello {
background-color: #888;
color: #fff;
font-family: 'Monotype Corsiva';
font-size: 25px;
}
.bubu { background-color: #fff; color: #000; }
<span class="hello">hello</span>
<span class="bubu">0c0c0c</span>
<span class="hello">1122334455</span>
<span class="bubu">0c0c0c</span>
<span class="hello">mooooo</span>
<span class="bubu">0c0c0c</span>