본문 바로가기
웹(Web)/CSS

박스모델

by 지하생활자 2021. 4. 15.

부피감을 결정하는 것이 박스모델

 

<!DOCTYPE html>
<html>
  <head>
    <style>
      p,a{
        border:10px solid red;
        padding:20px;
        margin:40px;
        width:120px;
      }
    </style>
  </head>
    <body>
      <p>
          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo, quis, nisi, illum debitis mollitia error,
          earum voluptatem repellendus fugit nam aliquid odit! Culpa suscipit, animi est adipisci vel quidem alias?
      </p>
      <p>
          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo, quis, nisi, illum debitis mollitia error,
          earum voluptatem repellendus fugit nam aliquid odit! Culpa suscipit, animi est adipisci vel quidem alias?
      </p>
      안녕하세요 <a href="http://a.com">생활코딩</a>
    </body>
</html>

 

인라인 방식에서는 width와 height값이 무시된다

'웹(Web) > CSS' 카테고리의 다른 글

마진겹침 현상  (0) 2021.04.15
Box-sizing  (0) 2021.04.15
인라인레벨vs블럭레벨  (0) 2021.04.15
레이아웃  (0) 2021.04.15
도구소개-Brackets  (0) 2021.04.15

댓글