| MovieOn - 4

🔆今日の目標

会員資格ページレイアウト

カスタマーセンターページレイアウト

メンバーシップページレイアウト

レイアウトに慣れたと勘違いしていましたが、本当に試してみました...まだレイアウトに慣れていません.爆発的にグーグルを通じて仕事を始めた.AOSはサンプルと公式ページで確認し、各種オプションを設定している.書くタイミングが悪いと思います.まず別のページを完成してjavascriptで修正しなければなりません.そうすれば、順番に出られます.
あ、それから、昨日の学院のパソコンの中の全体のサイズはとても小さくて、今日来てみて、大きくなって、そんなにきれいではありませんて、ほほほ、だから今大きさを調整するために急いで急いで修正している中で、問題の原因を考えてみて、2つの可能性があります!これはChrome Webブラウザが縮小されているためかもしれませんが、ウィンドウ表示設定では、プロジェクトのテキスト、アプリケーション、その他のプロジェクトのサイズが100%ではありません.

カスタマーセンターページレイアウト

入る前に。

会員資格ページを作成する前に、カスタマーサービスページを作成する前にいくつかの問題を考えたことがあります.メインコンテナの幅にしても、共通に出てくるサイドメニューの大きさにしても、基本的にサイトのコンセプトと同じ部分のスタイルがいいので、指定したほうがいいと思いますので、よくあります.cssを作成しましたが...ちゃんとメンバーに伝えられなかったようです.キャプテンとして大きな枠を決めて、それぞれの役割を分担させるべきだと思います.最大限の組長は自分を反省し、サポートの概念で隊員を助けるルールがあったので、あまり気にならなかった.今から数日が経ちましたが、これを選手たちに伝えるのは容易ではありません.それぞれの形で交わる部分が進行中です.今回のチームプロジェクトは大部分が非対抗で行われたため、コミュニケーションが難しく、積極性の面でも怠惰さを示した.

本文

垂直方向と水平方向の中央揃え

ブロック要素の親要素に次の内容を指定します.

<div class="block">
  <span>고객센터</span>
</div>

.block{
display:flex;
align-items: center;
justify-content: center;
}

これにより、必要な画像またはテキストを中央揃えできます.tableを指定したり、topやleft、transformを指定したりできますが、これは最も簡単な方法のようです.

fetch関数を使用してメニューの本文内容を変更する

Fetchは非同期で処理される.まず、既存のHTMLの一部を切り取り、新しいファイル(main.html)を作成して内容を貼り付けます.次にJavaScriptに次のように入力します.

fetch('../html/serviceCenter/main.html').then(function (response) {
    response.text().then(function (text) {
      let selector = document.querySelector('.contents');
      selector.innerHTML += text;
    });
  });

もちろん、別のメニューをロードすると、既存のデータが保存され、上書きされ、再追加されます.
結果はコツコツ!