CSS

Front End/JavaScript

[JavaScript 응용] 방명록 만들기 1. 방명록, 작성 기능

방명록 만들기, 작성 기능을 구현해보자. 작성자, 글 비밀번호, 내용을 작성하고 작성 버튼을 누르면 새로운 영역에 글이 작성되는 기능이다. 방명록 작성자 글 비밀번호 내용 작성 바디에서 작성자, 비밀번호, 내용 의 값을 사용자에게 받아 "작성" 버튼을 이용해 함수 a() 를 불러낸다. (onclick = "a()") 에서 각 값의 이름으로 접근해 값을 받아 변수에 담는다. 값들을 파라메터에 담아 mkDiv 함수를 불러낸다 mkDiv 는 div 태그에 감싸서 내용을 프린트 하기 위해 만들었다. 새로운 div 태그를 만들어 영역을 추가한다. 새 div 태그에 id를 지정하고 비밀번호를 추가한다. 아이디가 겹치지 않도록 cnt 를 추가한다. 생성된 div 에 출력할 내용을 담은 변수 html 을 초기화해준다...

Front End/JavaScript

[JavaScript] 자바 스크립트, 이벤트 핸들러

이벤트 UI에 발생한 사건이다. 클릭, 드래그, 페이지 로드, 입력값 변경 등이 있다. 이벤트 핸들러 이벤트가 발생했을 때 자동으로 호출되는 함수이다. 핸들러 등록 속성 on이벤트명 이벤트 처리 click : 클릭 시 발생하는 이벤트이다. onclick load : 페이지 열리자마자 발생하는 이벤트이다. onload window.onload = 함수명; // 코드 결합 function 함수명(){ } //onload 속성에 함수 등록 window.onload=함수명; => window의 onload 속성으로 핸들러 등록. // 위 두개 코드 결합하면. // 해당 함수는 onload 이외에 다시 사용할 일이 없어서 결합하여 한 번 사용하는 익명의 함수를 생성. // 익명함수. 이름이 없는 함수, 이벤트 핸..

Front End/JavaScript

[JavaScript, CSS, HTML] 오류 찾는 방법

개발자 도구 자바 스크립트에서는 코드를 통해 오류를 찾는 것이 아닌, 크롬 등의 브라우저의 개발자 모드를 통해 오류를 찾는다. 크롬의 경우, F12 혹은 도구 더보기 - 개발자 도구를 통해 오류를 찾는다. 개발자 도구 사용법 1. 오류가 발생한다면 개발자 도구 상단에 X 표시가 뜨게 된다. 이를 눌러주면 하단에 나온 에러의 파일 명을 선택하면 이와 같은 페이지가 나오며 오류가 생긴 부분을 알려줍니다. 이를 보고 고치면 끝! 참 쉽쥬?

Front End/HTML&CSS

[CSS] CSS의 작성법, 사용하는 이유

CSS 사용 용도 HTML을 더 편하게 꾸미는 코드. 요소 선택 태그명/id/class CSS 작성법 페이지 전체에 적용 : aaa bbb ccc ddd eee fff ggg hhh 이 모든 것들이 한 파일 안에 들어가 있으면 복잡하니, 코드를 CSS 파일로 저장해 필요할 때마다 import 하는 방법이 있다.

Front End/HTML&CSS

[HTML] HTML 기본 기능, CSS 파일 링크

CSS 파일 링크 css 스타일을 파일로 만들어 적용한다. CSS 파일을 생성 mystyle.css 파일을 생성해준다. CSS 파일 생성하면된다. 복잡한 CSS 요소를 파일로 따로 저장해주고 HTML 에서 불러오는 것이다. @charset "UTF-8"; h1 { width: 150px; height: 100px; background-color: yellow; } body { color: blue; } /* id를 할당하고 그에 따라 디자인 채워넣기 */ /* 아이디가 h1_1인 요소 */ #h1_1 { color: red; } /* h1요소 중에서 아이디가 h2_2 인 요소 */ h1#h1_2 { color: green; } /* 태그 종류 상관없이 클래스가 c1인 요소 */ .c1 { backgrou..

Lar
'CSS' 태그의 글 목록