웹개발 1주차

Jeong Yeongmin·2022년 9월 10일
0

web

목록 보기
1/5

클라이언트가 서버에 요청하면, 서버가 클라이언트에게 HTML+CSS+Javascript를 준다.

1. HTML(뼈대)

•HTML: pycharm->새로 만들기->html 클릭

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
</html>

2.CSS(꾸미기)

a) bootstrap(예쁜 CSS)
link: https://getbootstrap.com/docs/5.0/components/buttons/
head 안에 'Getting started'부분의 Bundle, Separate, Modules c/p하고 시작

b) 구글 웹폰트
link: https://fonts.google.com/?subset=korean
selected family에서 제일 마지막 link 태그를 복사한 후 head 사이에,
css를 복사해서 style사이에 *{c/p한 css}으로 넣기

c) Background와 항상 같이 오는 코딩문 3개

background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("url 넣기")  		
background-position: center 8%(vary)
background-size: cover

d) div로 잡혀있는 상자 안의 내용들만 가운데로 정렬할 때 같이 오는 코딩문 4개

display: flex;
flex-direction: column;
justify-content: center;
align-items: center;

3.Javascript(동작 수행)

a) Javascript-HTML 연결->버튼에 함수 연결

<button onclick="hey()">영화 기록하기</button>

b) 띄워놓은 페이지에서 빠르게 자바스크립트를 테스트할 수 있는 방법?

console.log(variable)

0개의 댓글