생활코딩 html/css/javascript 를 이용한 웹페이지 만들기

"2022년 백엔드 로드맵"


Html  => 정적인 웹 (Hyper Text Transfer Protocol)
css  => 웹 사이트를 보기 좋게 꾸미는 역할 (디자인에 최적화)
javascript  => html을 동적으로 바꿔줌

 

 

---

 

 

html

<> = tag
tag 뒤에 ;를 붙여서 문장이 끝났다는 것을 알리기
주석 <!-- -->를 사용해 태그가 끝난 부분에 설명을 붙이면 좋다

<string> = 굵게
<u> = 밑줄
<br> = 줄 바꿈
<p> = 단락 줄 바꿈
<img> = 이미지 삽입
<li> = 목록, 목차 지정
<ul> = <li>의 부모
<ol> = 숫자가 자동으로 넘버링 되는 기능
<h1> ~ <h6> = 제목
<a> = 링크를 걸 수 있는 태그
<div> = 아무런 의미가 없고 디자인의 용도로 사용됨 (화면 전체를 사용)

 

 

---

 

css

html과 연동 시키는 방법
<link rel = "stylesheet" href = "파일이 들어간 폴더 이름/파일이름">
주석 /* */

 

---

 

javascript

html과 연동 시키는 방법
<script src = 파일이 들어간 폴더 이름/파일이름.js> </script>
변수 작성할 때 앞에 "var" 적어주기
문자를 나타낼 때는 => "문자"
숫자는 기호 없이 그대로 작성한다

숫자 데이터 연산자 => + (더하기) - (빼기) * {곱하기) / (나누기)

배열은 대괄호 사용 [ ]
var 그룹 = [ "이름1" , "이름2" ]
그룹 [ 0 ] => "이름1"

반복문 => while ( i < 대상.length ) { 반복할 문장} => i는 대상의 개수보다 작게 문장이 반복된다

function => 함수 ( 수납상자 역할)
function 이름 ( 입력값 ) { 반복할 문장 }
반복하고 싶은 구간에 => 이름 ( ) ;

객체는 중괄호 사용 { }
모든 객체 지향 목록 값 가져오기
for ( var key in name ) {
document.write ( key + '<br>' );
}

 

 

https://github.com/mynameisseohyeon/html-css-javascript-practice