HTML 박스모델

카테고리 없음

HTML 박스모델

Canyi 2022. 10. 4. 10:27

서시 처럼의 꽉 차있는 블록을 하고싶을때에는 display: block ; 사용

윤동주 처럼 문자열부분만 블록 하고 싶을 때에는 display: inline-block; 사용

<html>
<head>
    <title>박스모델</title>
    <style>
        h1{
            border-width: 5px;
            border-color: red;
            border-style: solid;
            display: block;

        }
        a{
            border-width: 5px;
            border-color: red;
            border-style: solid;
            display: inline-block;      
        }
        
    </style>
</head>
<body>
    <h1>서시</h1>
    <a href="https://namu.wiki/w/%EC%84%9C%EC%8B%9C(%EC%9C%A4%EB%8F%99%EC%A3%BC)">윤동주</a>
    <p></p>
    죽는 날까지 하늘을 우러러
    한 점 부끄럼이 없기를,
    잎새에 이는 바람에도    
    나는 괴로워했다.
</body>
</html>