2/12 웹개발

>양쪽여백이 꽉차있기때문에 가로길이를 줘서 가운데로 오게 만듬.

[부트스트랩] : 다른사람들이 만들어놓은 탬플릿을 가져와서 쓰는것

(https://getbootstrap.com/docs/5.0/components/buttons/)

부트 스트랩을 불러오기위한 링크가 필요하다

 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
            crossorigin="anonymous"></script>

반응형(모바일처리)으로 만들기

 {
    width: 1200px;
    width: 95%;
}

(화면 폭 1200전에는 95%로 맞추다가 넘으면 1200으로 보여줘)

div에 여백주기

결과값

버튼에 onclick = 'hey'
입력해준뒤 클릭할때마다 짝수 홀수 나오게 만들기

제이쿼리 (Jquery) : 길고 복잡하게 써야하는것을 보다 직관적으로 쓸수 있게해줌

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
제이쿼리를 이용하기위해 추가시켜줘야하는 코드

document.getElementById("element").style.display = "none";  
 JS 코드

$('#element').hide();
JS와 결과값이 동일한 제이쿼리를 이용한 간결한 코드 
호출할떄는 아이디를 이용한다
ex) $('#아이디값').val

변수를 불러올떄는 ${변수명} 

각자 영화기록하기 ,닫기 버튼에 onclick='open-box'
onclick='close-box'
값을 준뒤
위코드를 입력해서 div에 있는 id값(post-box)를 가지고와서 영화기록하기를 클릭하면 보여지고 닫기를 클릭하면 포스트박스가 없어지게 할수있다.