17. 12. 09

09 Dec 2017 • TIL

##12.09

###오늘 한 일

  • 5분만에 CSS grid 배우기

    • css grid란 Bootstrap을 사용하지 않고 HTML Layout의 grid를 관리하는 것.
    • 부트스트랩과의 차이점은 무분별한 class name과 HTML tag가 사용되지 않는다.
    • 핵심 개념은 wrapper와 item(parent와 child)를 선언하고 css stylesheet로 관리 하는 것.
    • 성능이 부트스트랩에 비해 좋다는데 아직 확인해보지 않았다.
    • 사용법 예시
        <style>
        .wrapper {
            display: grid;
            grid-template-columns: 100px 100px 100px;
            grid-template-rows: 100px 100px;
        }


        .wrapper div {
            background-color: blue;
            text-align: center;
            border: 1px solid white;
        }


        .item1 {
            grid-column-start: 1;
            grid-column-end: 3;
        }
        .item3 {
            grid-row-start: 2;
            grid-row-end: 4;
        }
        .item4 {
            grid-column-start: 2;
            grid-column-end:4;
        }


    </style>
</head>
<body>
    <div class="wrapper">
        <div class="item1">1</div>
        <div class="item2">2</div>
        <div class="item3">3</div>
        <div class="item4">4</div>
        <div class="item5">5</div>
        <div class="item6">6</div>
    </div>
</body>

###파이썬기초 - 링크

  • what is Pythone?
    • “high-level programming language, and its core design philosophy is all about code readability and a syntax which allows programmers to express concepts in a few lines of code.”
    • 하이레벨 언어이면서 코드의 가독성과 몇줄의 코드로 프로그래머에게 개념표현을 허락하는 언어.
 CSS grid  Python

Comments

Related Posts