CSS BOX 에 사용되는 속성

devMarco·2022년 2월 10일
0

CSS BOX 속성

  margin : 20px; 
  border : 1px solid black;
  padding : 30px;
  border-radius : 5px;
}```
margin 가장 바깥쪽 여백
border 테두리(두께 선의종류 색상)
padding  안쪽의 여백
border-radius 모서리를 둥글게
가운데 정렬방법은 이미지와 비슷하게 
`display : block; margin-left : auto; margin-right : auto` 
로 속성을 준다.

margin, padding은 원하는 방향에 주는 방법
top. right, bottom, left 중 원하는 방향에만 속성을 줄 수 있다
`margin-top : 20px` 마진의 상단, `padding-left : 50px`
패딩의 왼쪽 같은 방법으로 원하는 곳에만 여백을 줄 수 있다
`margin : 5px 6px 10px 5px;` 띄어쓰기를 사용해 상,우,하,좌
순서로 여백을 줄 수 있고 -5px같은 음수도 사용이 가능 하다.

`.box {
  display : block;
}`
div box는 display : block 이 내장되어있다.
다른속성들은
`display : inline, inline-block, flex`등 여러가지가 있다.
필요한 속성들은 검색이 필요

일부속성은 상속되어진다.(inherit)
font-size, color, font-family, text-align 와 같은
폰트와 관련된 속성들은 부모태그에 입력을 해도 자식태그에 상속되어진다.
그래서 태그마다 폰트속성을 따로 줄 필요는 없다

0개의 댓글