개발/html, css, js
[JavaScript] 지역변수, 전역변수
변수를 선언할 때 쓰고자 하는 범위에 따라 전역변수와 지역변수로 나눌수 있다. 1. 지역변수 function globalVariable(a,b) { var a = 10; let b = 20; } 지역변수는 위와 같이 function 안에서 변수를 선언하여 function 내부에서만 적용이 된다. 2. 전역변수 var a = 10; let b = 20; 전역변수는 외부에서 변수를 선언하여 같은 파일 어디에서나 사용할수 있게 설정된다.
[JavaScript] 컴퓨터랑 가위바위보 만들기
1. 조건 유저랑 컴퓨터랑 가위바위보 하기 유저는 가위,바위,보 셋중 하나를 낸다. 컴퓨터도 마찬가지로 가위,바위,보를 낸다. (랜덤하게) 결과에 따라 승리, 패배, 무승부를 표시한다. 2. 결과 const userPick = prompt("가위, 바위, 보 중 하나를 내세요"); const computerPick = Math.floor(Math.random()*3); if (computerPick == 0){ console.log("컴퓨터는 가위를 냈습니다."); switch (userPick) { case "가위": console.log("무승부입니다."); break; case "바위": console.log("축하드립니다. 승리하셨습니다."); break; case "보" : console.log..
[JavaScript] 선언, 연산자, if문
1. 이름 짓기 let message = "Hello", age = 25, num = 1; 이와 같이 한줄에 여러 변수의 이름을 지정할수 있다. 하지만 가독성을 위해 권장하는 방법은 아니다. userName = "홍길동"; 이처럼 var, let , const를 안쓰고 할당을 해줄수 있지만 이 또한 권장하지 않는다. let my_Name = "홍길동" let my-Name = "허준" 첫번째줄의 언더바( _ )는 변수의 이름으로 선언할 수 있지만 하이픈( - )은 변수의 이름으로 선언할 수 없다. 대소문자도 구별해줘야 한다. const COLOR_RED = "#F00"; const COLOR_GREEN = "#F0"; 이처럼 기억하기 힘든것을 변수로 사용하는건 관습 중 하나이다. 보통 대문자로 표기한다...
[JavaScript] 변수
1. 변수 JavaScript 의 변수를 설정하는 방법은 여러가지가 있다. (1) var // 변수 구조 var 변수 = 값; var num1; 변수를 num1이라고 했을때 변수를 사용하려면 반드시 선언을 해야한다. 위와 같은 구조를 "변수 선언"이라고 한다. num1 = 10; 위와 같이 변수에 값을 대입하는 것을 "초기화" 라고 한다. var num1 = 10; 보통은 위와같이 변수선언과 동시에 초기화도 같이 해준다. var num1 = 30; 위와 같이 지정되 있는 변수값을 다시 선언할수 있다. 이것을 "재선언", "재할당" 이라고 한다. var는 재선언, 재할당이 모두 가능하다. (2) let let도 var와 같이 변수를 선언, 할당할 수 있다. 차이점 : let으로 변수를 선언, 할당할 경우 ..
[HTML] 형제 선택자, 속성 선택자
1. 형제 선택자 형제 선택자는 ~로 표시하며 처음을 제외한 나머지 선택자가 선택된다. 위와 같이 div~div 로 묶어주면 모든 div중 첫번째 div를 제외한 나머지 2,3,5 div를 선택한다. p~div 로 바꿔준다면 p뒤에 있는 div를 선택한다. 2. 속성 선택자 img 나 a태그에는 href, art, title 등 여러가지 속성이 있다. 이러한 속성들을 별다른 태그를 사용하지 않고 대괄호[] 로 묶어 선택할수 있다. 세부적으로 속성을 선택할 수도 있다. url까지 넣어주면 *를 이용하여 url의 일부를 넣어 줄수도 있다.
[HTML] CSS display, position
1. text 속성 종류 설명 color 글자색지정 text-decoration 텍스트에 밑줄이나 취소선 표시 여부 text-transform 텍스트 전체 또는 첫글자를 대문자로 표시 text-shadow 텍스트에 그림자 추가 text-align 텍스트 정렬 line-height 줄 간격 조정 letter-spacing 글자 사이 간격 조정 2. 박스모델 박스모델에는 블록레벨요소, 인라인레벨 두 가지로 나뉜다. 블록레벨 블록레벨 : 태그를 사용해 요소를 삽입했을때 혼자 한줄차지 (너비가 100%) ex) div태그, p태그 인라인레벨 인라인레벨 : 한줄을 차지 하지 않는다. 콘텐츠 영역 차지하고 나머지 공간에는 다른녀석이 올 수 있다. 한줄에 인라인 레벨 요소를 여러개 표시할 수 있다. 박스모델은 콘텐츠..