https://caniuse.com/:
필요한 태그들의 호환성을 볼 수 있다.(초록색이 많으면 많을 수록 호환성이 좋다.)
<style>
. = class
# = id
*{box-sizing:border-box; padding:0 margin=0} 작성할 때 적용하기!
{width:가로 넓이 height:세로 넓이}
{color: 글자 색지정}
{box-sizing:(border-box):지정구역을 벗어나지 않게하는 속성}
{text-align:가로속성의 정렬}
{vertical-align:세로속성의 정렬}
{text-decoration:텍스트의 밑줄이나 색상을 꾸며주는 속성}
{list-style-type:리스트의 type종류를 변경해주는 속성}
{font-size:글자크기}
{background: 배경의 색이나 크기 위치를 정할 수 있는 속성}
{border : 테두리}
{border-radius: 둥근형으로 만들어주는 속성}
</style>
배운 지식들
margin= 현재 요소의 주변 여백 padding= 콘텐츠 영역과 테두리 사이의 여백 border-collapse 의 기본 속성은 seperate 이고 collapse로 바꾸면 한 줄 표기가 된 다. border:double(이중선) 쓸 시에는 3px이상으로 써야한다.
- tag 들마다 기본 넓이가 있다
- 블록레벨 요소는 혼자 한줄을 차지하는 요소,단 table은 자식의 요소를 따른다.ex) div, p
- 인라인레벨요소:표시되는 콘텐츠만큼만 차지하고 나머지 공간엔 다른 요소 들어올 수 잇음 ex)img, strong
- 상우하좌 (css의 입력 순서)
- depth(깊이) 공동의 태그가 있을때 알아보기 쉽게 depth로 class명을 지정해 구분한다.
- img의 기본적인 힘이 강하다.
- img는 부모요소에서 먼저 값을 정하고 img자체는 100%로 주로 쓴다.
- img는 같은크기로 하는것이 기본상식.
- vertical-align (top, middle, bottom)은 세로정렬을 작용해주는 tag(공식)
- img는 크기가 큰것으로 준비하는것이 제일 좋다.(클라이언트에게 받은 자료는 언제나 보관) 동영상이나 오디오류는 muted를 해줘야 autoplay가 가능하다.
audio,video(autoplay muted loop poster}
autoplay=자동재생 muted=음소거(크롬 정책으로 인해 자동으로 시작되려면 음소거를 해야 시작이 된다.) loop=반복재생 poster=썸네일
a(anchor)<target="_blank"> = 새창 띄우기
input 과 button속성엔 쓸 수 없다.