HTML5 & CSS3 : grid / 코로나 비대면 수업

2022.11.16.

• UI/UX 반응형 웹디자인&웹퍼블리셔 개발자 과정 - DAY 44

 

---

Review


11/13 토요일부터 목감기 증상이 생겨서 이상하다 싶어 자가진단 키트를 해보니
곧바로 T선부터 선이 진하게 생기면서 2줄로 나타났다.
다음날 바로 PCR 검사를 하고, 이번주 월요일에 확진 통보를 받았다.

이때까지 코로나에 걸리지 않아서 나는 슈퍼울트라킹 면역 보유자인줄 알고 있었다.
뒷북으로 걸린 나는 아주 심하게 앓았다.
증상은 인후통 - 두통, 고열 - 근육통, 오한 - 콧물 - 가래 - 잔기침 순으로 나타났다.

월요일에 학원 측에 코로나 확진 사실을 알리고 비대면 수업을 신청했다.
학원에서 화요일부터 참여하라고 하셨는데, 화요일에 일어나자마자 도저히 몸을
일으킬 수가 없을 정도로 아픔을 직감하고 수요일부터 참여하겠다고 말했다.

오늘부터 Zoom으로 비대면 수업에 참여했다.
우리 반에 나 말고도 1명이 더 코로나에 확진되어서 선생님께서 다행히 진도를 많이
나가지 않으셨다. 대학교를 졸업하고 나서 코로나가 시작되어서 나는 비대면 수업
이라는 걸 해본 적이 없는데, Zoom으로 수업을 하니 신기하기도 하고 기분이 이상했다.
아직 적응이 잘 안 돼서 집중도 잘 안됐는데, 어쨋든 이번주 금요일까지는 비대면 수업으로
참여하기로 했다.

그동안 공부와 일을 병행해서 무리한 탓인지 면역력이 많이 떨어진 상태였을지도 모른다.
푹쉬고 재충전해서 다시 파이팅해야겠다.
밀린 진도를 따라잡으려면 남들보다 배로 열심히 해야지-

파이팅 - !

---

 

• UI/UX 반응형 웹디자인&웹퍼블리셔 개발자 과정 - DAY 44

 

 

---

<grid 알아보기>

 

 

- HTML

 

    <div class="grid-container">
        <div class="grid-item">1</div>
        <div class="grid-item">2</div>
        <div class="grid-item">3</div>
        <div class="grid-item">4</div>
        <div class="grid-item">5</div>
        <div class="grid-item">6</div>
        <div class="grid-item">7</div>
        <div class="grid-item">8</div>
        <div class="grid-item">9</div>
    </div>

 

 

- CSS

 

        .grid-container {
            width: 1200px;
            margin: 0 auto;
            display: grid;
            height: 500px;
            background: #ddd;
            grid-template-columns: 100px 200px 300px;
            /* justify-content: space-evenly;
            align-content: stretch; */
            /* place-content: align-content justify-content; */
            place-content: space-between;
        }
        .grid-item {
            background: #ccc;
            border: 1px solid #000;
        }