관리 메뉴

개발 공부

html - div활용(글자 중앙, 태그걸기) 본문

백엔드/Django

html - div활용(글자 중앙, 태그걸기)

방구석개발입문 2022. 11. 22. 14:20
  <div style="display: flex; flex-direction: row; text-align: center; justify-content: center; padding-top: 60px; ">

        <div style="width: 600px; height: 520px; background: gray ; position: fixed; right: 54% ;text-align : center; line-height : 480px; cursor:pointer;"
        OnClick=location.href="{% url 'main' %}">
            <p style="font-size:500%">매장</p>
        </div>

        <div style="width: 600px; height: 520px; background: gray; position: fixed; left: 56%; text-align : center; line-height : 480px;">
            <p style="font-size:500%">포장</p>
        </div>
</div>

프로젝트로 키오스크 만들 때 매장과 포장 선택 div만들때 모습이다

 

 

 

 

url 매핑에 name 옵션을 사용해 별칭을 이용해 링크를 건 모습임

OnClick=location.href="{% url 'main' %}"

div자체에에 위의 옵션으로 링크를 걸었음

 

 

text-align : center; line-height : 480px;

위의 옵션을 통해 글자를 중앙에 정렬함