Создай веб-страницу с блоками, стоящими в ряд. Внутри каждого блока должна быть картинка, заголовок и параграф

помогите пожайлуста я понял как картинки вставить


Ответы (1 шт):

Автор решения: Zhihar

сделать блок внутри которого будут стоять остальные блоки (в ряд или столбец, как вам уж угодно, для чего можно использовать flex)

<div class = 'container'>...</div>

блоки, содержащие картинку, заголовок и параграф можно задать так:

<div class = 'block'>
    <span class = 'title'>...</span>
    <img>
    <p>...</p>
</div>

т.е. все будет выглядеть так:

<div class = 'container'>
    <div class = 'block'>
        <span class = 'title'>...</span>
        <img>
        <p>...</p>
    </div>
    <div class = 'block'>
        <span class = 'title'>...</span>
        <img>
        <p>...</p>
    </div>
    <div class = 'block'>
        <span class = 'title'>...</span>
        <img>
        <p>...</p>
    </div>
</div>

и осталось расписать блоку свойства через стили

.block {
    width:  100px;
    height: 200px;
}

.block .title {
    display: inline-block;
    width:   100%;
    height:  30px;
}

.block img {
    width:  100px;
    height: 100px;
}

.block p {
    display:   inline-block;
    width:     100%;
}

А дальше уже наворачивайте свои стили и т.д.

→ Ссылка