희락코딩

HTML 태그 정리 HTML에서 자주 쓰는 태그 위주로 정리했습니다! 코드펜에서 직접 실습을 하면서 어떻게 출력되는지 확인하면서 익혀보도록 합시다!!! https://codepen.io/pen/ Create a New Pen ... codepen.io 코드펜과 함께 실습해보기!!! 1. div (블럭요소) 내용 // 특별한 의미가 없는 구분을 위한 요소 2. span (인라인요소) 내용 // 특별한 의미가 없는 구분을 위한 요소 ▶ div태그와 span 태그의 차이점을 css를 통해 쉽게 이해하자!! // CSS // 코드펜에서 사용하기 div { background-color : red; width : height : } span { background-color : blue; width : heigh..

HTML HTML 은 Hyper Text Markup Language 약어로 웹 브라우저를 통해 사용자에게 보이는 웹 문서를 작성하기 위한 언어 입니다. 다시 말해 보여지는 브라우저의 구조를 설계하며 웹 페이지를 위한 마크업 언어입니다. 1. HTML 기본 문법 1.1 태그(TAG) ▶ 열린 태그와 닫힌 태그 안에 요소를 담습니다. 내용 //이를 묶어 하나의 요소라 합니다. 열린태그 요소내용 닫힌태그 1.2 부모와 자식관계 ▶ 부모태그는 자식태그를 감싸줍니다. // 일반적인 부자 관계 태그 내용 부모태그 자식태그 // 상위태그와 하위태그 (조상태그와 후손태그) 내용 빨간색태그 기준으로 아래로 갈 수록 자식요소와 후손요소를 만납니다. (하위요소) 초록색태그 기준으로 올라 갈 수록 부모요소와 조상요소를 만납..

개발 공부 8일차 (html , css) 오늘은 html 과 css 관련 해서 다양한 유튜브 영상과 구글링을 통해 공부를 했다! 자바스크립트와 달리 html과 css는 내가 적은 코드가 시각적인 변화가 있어서 너무 재미있었다! html은 어느정도 이해가 갔는데 css는 좀 더 공부를 해야될 것 같다. 특히 css는 html에서 구도를 명확하게 잡아야 되는 것을 느꼈다. 화려한 건축 기술이 있다해도 기초공사가 부실하면 무너져 버리기 때문이다! 아 그리고 코드펜이라는 사이트는 정말 유용하다!! 다양한 실험을 할 수 있기 때문이다!!! 혹시 모르니 링크를!!! ㅋㅋ 내일도 시간적인 여유가 있으면 틈틈히 연구해야겠다! 내일도 화이팅!! https://codepen.io/ CodePen An online code..

함수 함수는 실행 가능한 코드가 담겨있는 특별한 객체입니다. 선언한 함수를 호출하여 사용이 가능하고, 인자로 값을 받아 다룰수 있습니다. 1. 함수 정의 1-2. 함수 선언문 ▶ 함수를 정의하는 방식은 함수 선언문과 함수 표현식이 있습니다. 함수를 구성하는 내용은 function, 함수명, 매개변수, 블론문 으로 구성 되어 있습니다. // 함수 선언문 // function 함수명(매개변수) { // 함수에 이름이 있어 기명함수로도 불립니다. 블록문 (실행문) } // 예시 // function add(x, y) { console.log(x+y) } add(3,6) // 9 함수 호출 1-2. 함수 표현식 ▶ 함수는 일급 객체이므로 변수나 자료 구조에 저장이 가능합니다. 이를 이용해서 할당하는 방식을 함수..

삼항 연산자 활용하기 삼항 연산자는 JavaScript에서 3개의 항을 사용하는 유일한 연산자 입니다. 조건 연산자는 조건에 따라 2개의 값중 하나를 가질 수 있습니다 삼항연산자의 장점은 단순한 조건의 코드일 경우 불필요한 코드를 줄일 수 있어 알아두면 너무 유용한 연산자 입니다. 대부분 어렵게 느껴져서 그냥 넘어가는 경우가 있는데 원리만 알면 너무 쉽고 다양하게 응용할 수 있어서 알아 두면 너무나 좋은 꿀팁 중에 꿀 연산자 입니다. // 삼항 연산자 구조 // 조건 ? 값1 : 값2 ▶ 만약 조건이 참이라면, 조건 연산자는 값1을 값으로 갖습니다. 그렇지 않은 경우 조건 연산자는 값2을 값으로 갖습니다. 표준 연산자를 사용하는 어디든 조건연산자를 사용할 수 있습니다. // 예시 // age >= 20 ..

Math. 메서드 정리 Math메서드는 우리가 수학적 계산을 할 때 유용하게 쓰이는 메서드 입니다. 수학적인 상수와 함수를 위한 속성과 메서드를 가진 내장 객체입니다. 함수 객체가 아닙니다. 1. Math.abs() ▶ Math.abs()는 숫자의 절대값을 나타내주는 메서드 입니다. console.log(Math.abs(-7)) // 7 let absNum = 5 - 13 Math.abs(absNum) // 8 2. Math.min() ▶ Math.min()는 각각의 숫자들 중 최소 값을 나타내는 메서드 입니다. Math.min(7,3,6) // 3 let num1 = 4 let num2 = -5 Math.min(num1, num2) // -5 3. Math.max() ▶ Math.max()는 각각의 숫..

반복문 반복문은 조건식의 평가 결과가 참인 경우 코드 블록을 실행합니다. 그 후 조건식을 다시 평가하여 여전히 참인 경우 코드 블록을 다시 실행합니다. 이는 조건식이 거짓일 때까지 반복됩니다. 1. for문 ▶ for문은 특정 조건을 불충족할때까지 반복 됩니다. // for문 구조 // for(초기화; 조건; 증감;){ 코드 실행 } // for문 순서도// for(let i=0; i 0 log(0) -> i++ i = 1 -> 1 log(1) -> i++ i = 2 -> 2 log(2) -> i++ i = 3 -> 3 false -> 반복문 종료 // for문은 위와 같은 형태로 진행되고 조건문에서 거짓이 나올때까지 진행됩니다. 1. while문 ▶ w..

문제 function makeLast(name, period) { } ▶ 사용자의 이름과 미접속 시간(분)을 입력받아 조건별로 다른 메세지를 리턴해야 합니다. string 타입을 리턴해야 합니다. 미접속 시간이 1시간 보다 적을 경우, 분 단위로 표기합니다. 미접속 시간이 1시간 보다 크고 24시간 보다 적을 경우, 시간 단위로 내림처리하여 표기합니다. 미접속 시간이 24시간 보다 클 경우, 일 단위로 내림처리하여 표기합니다. ▶ 입출력 예시 let output = makeLast('mike', 40); console.log(output); // --> 'mike: 40분 전에 접속함' output = makeLast('mike', 121); console.log(output); // --> 'mike:..