0722

1)학습한 내용

깃허브 프로젝트 호스팅
html

<section class="section2">
        
        <div class="pro_text">
            <h1>프로젝트</h1>
            <h2>RESOFT PROJECT</h2>
            <h3>쾌적한 서비스 제공을 위해 사용자 입장에서<br> 생각하고 항상 새로운 도전을 시도합니다.</h3>
        </div>
        
    <div class="eco_text">
        <div class="eco">
            <img src="./img/common/main_ecoce@2x.png">
        </div>
        <div class="text_1"><h1>에코스 ECOCE(ECO-Clean Earth)</h1>
            <h2>국내 최초<br>탄소중립 실천인증 플랫폼</h2>
    </div>
    </div>

    <div class="moa_text">
        <div class="moa">
            <img src="./img/common/main-moado@2x.png">
        </div>
        <div class="text_2"><h3>모아두 (moaDo)</h3>
       <h4>내 손안의 모바일 회원수첩</h4>
    </div>
    </div>

        <div class="pro_ani">
            <lottie-player src="./img/animation/lf20_hk8wc3df.json" background="transparent" speed="1" style="width: 680px; height: 680px;" loop autoplay></lottie-player>
        </div>
</section>

*css

.section2{
    width:1920px;
    height: 1147px;; 
    position: relative;
    background-color: #F9F9F9;
}

.pro_text{
    position: absolute;
    text-align: right;
    left: 1220px;
}

.pro_text h1{
    margin-top: 100px;
    font-size: 40px;
}

.pro_text h2{
    font-size: 18px;
    color: #C8C8C8;
}

.pro_text h3{
    font-size: 26px;
    margin-top: 50px;
}

.eco{
    left: 240px;
    top: 211px;
    position: absolute;
    width: 534px;
    height:393px;
    overflow: hidden;
    border-radius: 90px;
}

.eco img{
    width: 534px;
    height:393px;
    margin: 0 auto;
    transition: all 0.2s linear;
    opacity: 1;
    background-color:#F9F9F9 ;
}


.eco img:hover{
    filter: brightness(40%);
    transform: scale(1.2)
    
}

2)학습내용 중 어려웠던점

X

3)해결방법

X

4)학습소감

혼자서 코드를 찾아보고 쓰다보니 공부도되고 코드쓰는실력이 발전하는거같다 점점익숙해지고있다