이번에는 만들어놓은 index.html에 포스팅 박스를 만들어 보는 시간이다. 위 이미지 처럼 포스팅 박스를 만들어 주면 된다. Box 이름표 만들고 설정하기! 내 생애 최고의 영화들 영화 기록하기 간단한 글씨를 씁니다. body mytitle 밑에 mypost 이름표를 만들어 주고 간단한 글씨를 씁니다.라고 적어주었다. 텍스트를 넣음으로써 어느 위치에 코드를 넣은 것인지 확인이 되었다. 영역확인과 설정 .mypost { background-color: green; width: 500px; } Box 칼라를 넣어 영역을 확인하고 폭을 500px로 설정하였다. Top과 포스팅 박스 사이의 여백을 만들어 주고 중앙으로 이동시켜보자! .mypost { background-color: green; width: ..

어제에 이어서 부트스트랩 사이트에 코드를 편리하게 활용해보자! 페이지 Top 아래에 카드를 만들어보자! 부트스트랩 사이트 Components에서 Card를 선택해서 만들고자 하는 디자인을 선택해서 코드를 복사하자! Card title This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer. Card title This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit long..

로그인 페이지 좌우 여백을 설정하여 중앙으로 이동시켜보기! 페이지 가운데로 모아주기 위해서는 아래 코드를 하나의 div로 묶어 주어야 한다. 로그인 페이지 아이디, 비밀번호를 입력해주세요 ID: PW: 로그인하기 wrap 이름표를 만들어 아래 코드처럼 으로 묶어 준다. 로그인 페이지 아이디, 비밀번호를 입력해주세요 ID: PW: 로그인하기 그리고 head의 style 아래처럼 입력한다. .wrap { background-color: green; } 위 스샷을 보면 양쪽 여백이 없이 꽉 차있다는 것을 확인하였다. 영역의 가로 사이즈를 수정하자. .wrap { background-color: green; width: 300px; } 이제 저 박스 밖의 여백을 밀어주기 위해서 margin을 이용해보자. .wr..

이번 강의는 전에 만들었던 로그인 페이지에 이미지를 넣고 ID, PW를 입력할 수 있는 박스를 만들고 로그인 버튼을 만드는 내용이다. 위 스샷처럼 브라우저에 표현이 되도록 코드를 입력해보자. CSS 내용 넣기 로그인 페이지 아이디, 비밀번호를 입력해주세요 ID: PW: 로그인하기 로그인 페이지 제목과 설명글을 입력해 주었다. 로그인 페이지 아이디, 비밀번호를 입력해주세요 div /div는 하나의 박스로 묶여 있다고 한다. 브라우저 색상이 흰 바탕으로 되어 있기 때문에 이것을 확인하는 방법으로 색을 넣어보면 알 수 있다. 로그인 페이지 아이디, 비밀번호를 입력해주세요 ID: PW: 로그인하기 body 안에 div를 이렇게 mytitle이란 이름표를 만들어 주고 head의 title밑에 style을 만들어 ..