포시코딩

배경이미지 넣기 background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), /* 이미지 어둡게 */ url('이미지경로'); background-size: cover; background-position: center; 내용 중앙정렬 display: flex; flex-direction: column; justify-content: center; align-items: center; 모서리 굵기 무시 box-sizing: border-box;

맨날 헷갈리는 display 딱 정리하고 감 display: none; 화면에서 사라짐. 크기 자체도 차지하지 않음 display: block; 일반적으로 설정하지 않아도 div가 갖게되는 기본값 기본적으로 width가 자신의 컨테이너의 100%. 쉽게 말하자면, 가로 한 줄을 다 차지 display: inline; 컨텐츠를 딱 감쌀정도의 크기. block 태그와 다르게 줄바꿈이 되지 않고, 반드시 컨텐츠를 감싸게 되고, 크기를 변화시킬 수 없다. 테스트에서 width를 임의로 500px 로 바꾸어줬지만 크기는 여전히 글의 길이 만큼인걸 확인 가능 display: inline-block; inline과 block의 특성을 합쳐놓은 속성. 기본적으로는 inline의 속성을 지니고 있지만, 임의로 크기를 바..