많이 사용하는 css 속성을 정리합니다.

이번 글에서는 css에서 자주 사용하는 속성에 대해서 정리를 하겠습니다.

css 기초에 대해서 알아봅니다.

 

.myBox {     margin : 20px;     padding : 30px;     border : 1px solid black;     border-radius : 5px; }

margin은 박스의바깥 여백을 지정합니다.

padding은 박스 내부의 안쪽 여백을 지정합니다.

border는 테두리 (차례로 두께, 선의 종류, 색상)를 넣을 수 있습니다.

border-radius는 테두리 둥글게 처리하는 기능입니다.

가운데 정렬 >> display : block; margin-left : auto; margin-right : auto 이렇게 주면 됩니다.

 

 

margin-top : 20px; padding-left : 30px;

top, left, bottom, right 중 원하는 곳에만 여백을 줄 수 있습니다.

- margin은 음수도 가능합니다. -20px 이런 식입니다.

- margin : 5px 6px 7px 8px; 이렇게 띄어쓰기를 이용해 작성하시면

차례로 상 우 하 좌 마진을 5,6,7,8px 한번에 줄 수 있습니다. 

 

 

우리가 사용하는 스타일은 부보에서 자식에게 물려주게 됩니다.

이것을 inherit 이 된다고 말합니다.

 

font-size, color, font-family, text-align 이런 속성들은

부모 태그에 넣어주게 되면, 부모안에 있는 자식들에게 상속됩니다.

즉, 거기 안에 있던 태그들까지 전부 상속됩니다. 

 

안에 글자들이나 태그들이 많을 경우 번거롭게 전부 font-size를 작성안해도 되는 것이죠!!! 

부모태그에 한번에 작성하고 끝낼 수 있으니 편리합니다. 

다 inherit되는건 아닙니다. 주로 글자와 관련된 스타일들이 주로 상속이 됩니다.