margin/padding 프로퍼티
4개의 값 설정시
margin: 10px 20px 30px 40px;
=순서대로 top, right, bottom, left (시계방향 생각하면 됨)
3개의 값 설정시
순서대로 top, right&left, bottom
2개의 값 설정시
top&bottom, right&left
1개의 값 설정시 모두 통일
참고: block 특성을 가진 요소에 대한 중앙 정렬
width: 100px /* 명시적으로 지정 必 */
margin-left: auto;
margin-right: auto;
또는 margin 단축설정을 활용하여서 margin: 10px auto;
(텍스트가 아니라 박스 자체를 가운데로 가져오는 것. 텍스트 중앙 정렬은... text-align: center; 였나 그랬던 것 같음 기억상)
border 프로퍼티
보더스타일 참고 사이트 https://developer.mozilla.org/ko/docs/Web/CSS/border-style
border-style - CSS: Cascading Style Sheets | MDN
border-style CSS 단축 속성은 요소 테두리 네 면의 스타일을 지정합니다.
developer.mozilla.org
보더컬러는 보더스타일(border든... border-style이든...)이 설정되어 있어야 적용이 된다. 보더가 있어야 색상이 출력되든 말든 하니까.
border-width, style, color를 각각 설정해도 되지만 이 세 가지 프로퍼티를 한 번에 설정할 수 있음.
border를 단축 프로퍼티로 쓰는 것 ~
border: 4px solid orange; 식으로 입력하면 됨.
background 프로퍼티
background-image에 2개 이상의 이미지를 첨부한 경우,
background 속성 프로퍼티를 각각의 이미지에 적용하려면 속성값 사이에 콤마를 넣어주면 됨.
ex.
background-image: url("링크1"), url("링크2");
background-size: 25%, contain;
backgroung-repeat: no-repeat, repeat;
background: ←얘도 단축 프로퍼티임.
color image repeat attachment position 순서
block/inline
사실 이 부분 강의를 날로 들어서 이해가 안 됨(;;)
text
이 부분은 크게 어려운 것은 없음