以下の図と同じように作る

アセット 2.jpg

手順

sample.zipをダウンロードして解凍する。
sectionタグを書き、その中に見出しを書く。
見出しの下に、divタグを書く。
divタグの中に、imgタグとpタグを書く。
sectionタグを、1000pxでセンタリングする。
divタグの中を横並びにする。
pタグの横幅を550pxにする。
divタグの横の並び方を左右等間隔にする。

回答例

https://www.youtube.com/embed/nfWEuT9BJro?si=d2OggzesHXHrYPnG

作成したコード

<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/style.css">
</head>

<body>
    <section>
        <h1>見出し見出し見出し見出し見出し見出し見出し見出し</h1>
        <div>
            <img src="img/sample.jpg" alt="">
            <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>
        </div>
    </section>
</body>

</html>

section {
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

div {
    display: flex;
    justify-content: space-between;
}

div p {
    width: 550px;
    margin: 0;
}