라이브러리 필요 없어!어쨌든 화면 중앙에 표시를 해야 돼요.

2470 단어 HTMLCSS
아래 내용을 참고하여 최소한의 표기를 통해 화면 중앙의 정렬을 실현하였다.
  • flexbox로 위아래 좌우 중앙으로 정렬-Qiita
  • "Height:100%" 요소가 화면 높이 100% 미만일 경우 대응 방법 - Qita
  • <style>
    html {
        height: 100%;
    }
    
    body {
        height: 100%;
        margin: 0;
    }
    
    .Aligner {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        height: 100%;
    }
    </style>
    
    <div class="Aligner">
        <img src="UKRrZMi.gif" width="128px">
    </div>
    
  • gif: LGTM.in » kcLgRb11q
  • 좋은 웹페이지 즐겨찾기