웹디 기본 셋팅

1. style.css 에서 기본 셋팅

@charset "utf-8";

*{margin: 0; padding: 0; box-sizing: border-box;}
li{list-style: none;}

box-sizing: border-box를 해둬야 box사이즈가 유지됨.

li{list-style: none;}

li{list-syle: none;}을 해줘야 쩜을 없애고 쓸 수 있다.
a태그는 보통 밑줄을 가지고 있다. 그래서 밑줄을 없애주고 컬러를 상속받게 해주는 코드

a{text-decoration: none; color: inherit}

img {
  max-width: 100%; vertical-align: top;
}

• max-width: 100% 꽉채워지지만 원래 사이즈보다 더 커지진 않음
• img는 인라인 요소인데 baseline을 기본적으로 넣기 때문에 여백이 생긴다. 그래서 vertical-align: top을 해줘야 base라인이 올라가서 빈틈이 사라지고 아래
  

table{width: 100%; border-collapse: collapse;}

button {
  cursor: pointer;
}

마우스 커서를 손가락모양으로 바꿔줘서 클릭을 유도함

body{background-color: #369; color: #333; font-family: '맑은 고딕';}

백그라운드컬러, 폰트컬러, 기본폰트를 지정해준다.

• 우선 컬러가 잘 들어오는지 확인을 하기 위해서 백그라운드 컬러는 유색으로 설정해본다.

1. 기본적인 css작성을 하고 html에서 연결을 시켜주고나면,
2. js에서 제이쿼리 오픈소스 연결, js기능을 연결 시켜준다. 제대로 js가 연결되었는지 alert으로 확인해본다.

$(function () {
  //문서를 로딩 후 실행하라
  alert("경고");
});

영상 출처 : 이미니 강사 유튜브