목록웹 개발 (224)
dukDukz
오류 더보기 html, css, js index.html 취업자인터뷰 글자 내용 1 글자 내용 2 글자 내용 3 글자 내용 4 < > index.css *{ margin: 0; padding: 0; } ul,li{ list-style: none; } a{ text-decoration: none; } img{ display: block; line-height: 0; } #warp{ width: 100%; } #header_wrap{ width: 100%; background: red; } #header{ width: 1200px; height: 100px; margin: 0 auto; background: blue; } #snb_wrap{ width: 100%; height: 200px; backg..
기본 틀 index.html index.css /* CSS Style sheet */ *{ margin:0; padding:0; } ul,li{ list-style:none; } a{ text-decoration:none; } img{ display:block; line-height:0; } #wrap{ width:100%; } #header_wrap{ width:100%; background:red; } #header{ width:1200px; height:100px; background:blue; margin:0 auto; } #snb_wrap{ width:100%; height:200px; position:absolute; background:yellow; z-index:3; } #snb{ widt..
배너 만들기 더보기 banner.html 버튼1 버튼2 버튼3 버튼4 버튼5 banner.css *{margin: 0; padding: 0;} ul,li{ list-style: none; } a{ text-decoration: none; } img{ display: block; line-height: 0; /* line-height만 사용하면 안먹음 display: block;으로 해줘야함 공간이 남는 현상 제거 */ } #banner{ position:absolute; /*앞으로 떴기 때문에 아래있던 버튼들이 올라오게됨*/ top: 300px; } #banner>ul>li{ position: absolute; top : 0px; /*겹쳐서 image5가 가장 위로 올라오게됨*/ /*상위에 있는 애의 p..
developer.mozilla.org/ko/docs/Web/API/Document what_is_js.html what_is_obj.html hello world 1 hello world 2 hello world 3 hello world 3 hello world 4
developer.mozilla.org/ko/docs/Web/API/Document 1. 변수, 함수의 타입 (+함수에 변수를 지정하는 법 : return) 더보기 2. 객체란 무엇인가? Object Object 안에 3개의 type 이 있는데 1. Array 2. function 3. Object www.codingfactory.net/10436 더보기 hello world 1 hello world 2 hello world 3 hello world 3 hello world 4
1. 첫번째 방법 move_img.html 더보기 visual_ul.appendChild(li[0]); 이 부분을 추가해줬다. li 를 보면 0번째 li가 계속 밑으로 오는게 반복하는 것을 알 수 있다. + 첫번째 방법 추가 설명 더보기 [Element, Element, Element] 0 1 2 각각의 엘리먼트를 담고 있는 배열 값으로 반환이 된다. --> li 전체를 (유사)배열 형태로 저장한다. 2. 두번째 방법 ex.html 더보기 참고 블로그 1. appendChild(), insertBefore() appendChild(), insertBefore() appendChild() 자식 노드의 마지막에 노드가 삽입된다. insertBefore() insertBefore()는 appendChild()..
전체 코드 _ 수업 중 한것 더보기 전체 코드 _ 수업 중 한것 to do list sample1 sample2 sample3 정리한 버전 (주석 포함) 더보기 clean ver to do list sample1 sample2 sample3 삭제 버튼 더보기 삭제 버튼 /*삭제버튼*/ 스크립트 부분만 (주석 없음) 1. 입력된 텍스트를 가져온다 2. 값을 적을 리스트 전체를 가져온다 3. 새로운 li를 만들어준다 4. 새로운 li에 텍스트의 value를 넣어준다 5. 삭제 버튼을 만들어준다 6. 삭제 버튼에 들어가는 내용 'X' 를 넣어준다 7. 삭제 버튼을 클릭했을때 li에 있는 삭제 버튼의 부모값인 li 전체를 사라지게 한다. 8. 새로운 li에 삭제 버튼을 넣어주는 걸 표현한다 9. 리스트에 완성된..
html 작성.. input tag들 가운데 정렬 : text-align center to_do_list.html to do list sample1 sample2 sample3 1. 새로운 입력값 받아오기 card_text = document.querySelector('#card_input'); car_text에 이거 전체를 담은것 입력창에 입력되는 값을 받아옴 2. 전체 리스트 받아오기 cardList = document.querySelector('.cardList'); cardList 에 sample1 sample2 sample3 이거 전체를 담은것 추후에 출력할 값을 넣을 리스트를 받아옴 3. 새로운 li 생성하기 liElement = document.createElement('li'); 새로운 l..