Строчные и блочные элементы

Давайте для начала научимся применять CSS-элементы к тегам. Для этого нам понадобится атрибут style

Построим блок

<div style=”width:200px;height:100px;background:red”>
</div>

За счет атрибута style мы применили CSS-свойства к тегу div. Если все хорошо, нам выведется красный прямоугольник.

Сделаем страницу с двумя блоками и двумя картинками подряд

<html>
<body>
<div style=”width:200px;height:100px;background:red”>
</div>
<div style=”width:300px;height:150px;background:green”>
</div>
<img src=”city.jpg”>
<img src=”sea.jpg”>

</body>
</html>

//////////////////////// Обратим внимание на то, что получилось Блоки отобразились каждый с новой строки, а картинки расположились в одну строчку. Все различие в том, что есть блочные и строчные элементы

Свойство display

display:block; (например <div>)
display:inline-block; (например <img>)
display:inline;   (например <span>)