border size 설정하기

웹(클라이언트)/CSS

border size 설정하기

여동동 2021. 9. 27. 15:59

소스코드

<!DOCTYPE html>
<html lang="en" dir="ltr">
<style media="screen">
  div{
    margin:10px;
    width:150px;
    box-sizing:border-box;
    /*border의 크기가 달라도 결과적인 박스의 크기를 같게 만든다.*/
  }
  #small{
      border:10px solid black;
  }
  #large{
      border:30px solid black;
  }
</style>

  <head>
    <meta charset="utf-8">
    <title>Box Model</title>
  </head>
    <body>
      <div id="small">Hello</div>
      <div id="large">Hello</div>
    </body>

</html>

결과값