ネットワーク開発総合クラス第1週(研究)

3488 ワード

(第1週目目標)
HTML, CSS basic
Javascript basic
1.Frontend構成
HTML- 뼈대 

CSS- 꾸미기 (bootstrap은 예쁜 css 꾸러미)
     뭔가를 꾸민다는 것 = 가리킬 수 있어야 한다
	① 이름표를 붙인다 class="mytitle" 
	② 이름표를 어떻게 하라고 명령한다 .mytitle {어떻게 하라고}

Javascript- 움직이게 해주는 것 (브라우저가 알아들을 수 있는 언어)
2. HTML/CSS
background-color
background-image
background-size

width/max-width
height

font-size
font-weight
font-family

color

margin(바깥 여백)
padding(안쪽 여백)

border(귀퉁이)
border-radius(귀퉁이 둥글게)

가운데로 맞출땐
background-image : url("");
background-size : cover;
background-position : center;

안에 있는 내용물들을 정리할 땐
display : flex;
flex-direction : column;
justify-content : center;
align-items : center;

요소 하나씩 접근할 땐
.mytitle > .button {}

어둡게 만들 땐
background-image : linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url("");

모바일 처리 (웹에서 검사로 확인 가능)
max-width : 500px;
width : 95%;
3.CSSファイルを分離する
새 스타일 시트에 (예, mystyle.ss)
스타일 안에 부분 복사한 후 붙여넣기

그리고 이 자리를 대신해서
<link rel ="stylesheet" type="text/css" href="(css파일 이름).css">
4. Javascript
<style></style> 아래 <script></script>로, console에서 똑같이 적용된다.

let a=1
let b=2
let c=안녕
a+b = 3, b+c = 2안녕

let a_list = ['수박','참외','배']
a_list[1] = '참외'
a_list.push('감') = ['수박','참외','배','감'] # list 추가하는 법
let b_list = ['철수','영희']
a_list.push(b_list)
a_list = ['수박','참외','배','감',Array(2)]

let a_dict = {'name':'bob','age':27}
a_dict['name'] = 'bob'
a_dict['height'] = 180 # dictionary 추가하는 법

let myemail = '[email protected]'
myemail.split('@') = ['sparta','gmail.com']
myemail.split('@')[1] = 'gmail.com'
myemail.split('@')[1].split('.') = ['gmail','com']
myemail.split('@')[1].split('.')[0] = 'gmail'

alert
console.log