Day63 -[css]플롯 퀴즈

2021. 5. 16. 23:40css/Quiz

아래의 사진 처럼 만들 것.

아래의 사진 처럼 만들 것.

<style>
        .outer{
            border: 1px solid #777;
            width: 30%;
            margin: 0 auto;

            overflow: hidden;
        }

        .img , .inner{
            width: 50.0000%;
            float:left;
            box-sizing: border-box;
        }

        .inner {
            border: 1px solid #777;

            overflow: hidden;
        }

        .top, .bottom{
            border: 1px solid #777;
        }

        .top{
            padding-bottom: 20px;
        }
        
        .left{
            float:left;
        }

        .right{
            float:right;
        }
        
        .cart{
            overflow: hidden;
            clear: both;
            text-align:center;
        }

        button {
            border: 1px solid #777;
            float: left;
            width: 50.0000%;

            box-sizing: border-box;
            background-color: rgb(245, 239, 239);
        }

    </style>

위의 사진을 만들기 위해서는 블럭을 몇개 만들어야 하는지 개념이 필요함.

아래의 블럭 참조.

아래의 사진 처럼 만들 것.

1개만 만들면, 복붙 이기 때문에, 1개의 코드만 올림.

'css > Quiz' 카테고리의 다른 글

Day64 - Quiz ( 레이아웃 )  (0) 2021.05.18