본문 바로가기

분류 전체보기169

02. Bootstrap, 버튼 (Buttons) ○ 기본 버튼 스타일 ① Bootstrap3 Basic Default Primary Success Info Warning Danger Link ② Bootstrap4 / Bootstrap5 Basic Primary Secondary Success Info Warning Danger Dark Light Link ○ 아웃라인 버튼 - Bootstrap4 / Bootstrap5 Primary Secondary Success Info Warning Danger Dark Light ○ 버튼 스타일 적용할 수 있는 태그 - , , : clss="btn" 사용가능 Link Button Button ○ 버튼 사이즈 ① Bootstrap3 : 4가지 사이즈 제공 Large Normal Small XSmall ② Boot.. 2022. 6. 23.
01. Bootstrap, 시작하기 (링크, 다운로드, 뷰포트 설정) ○ Bootstrap - HTML, CSS, and JavaScript framework - Bootstrap 3, 4, 5가 있다 - 웹페이지 개발시 frontend(UI)단을 구현하기 위한 무료 오픈소스 - 주로 CSS, 레이아웃, 반응형 웹 구현시 많이 사용한다 - 하나의 CSS로 휴대폰, 태블릿, 데스크탑까지 다양한 기기에서 작동 - 다양한 기능을 제공하여 사용자가 쉽게 웹사이트를 제작, 유지, 보수할 수 있도록 도와줌 ○ Bootstrap 사용 방법 ① viewport 설정 - 다운받은 부트스트랩을 사용하고 싶으면 태그에 뷰포트 반드시 설정해야 함 - 뷰포트 설정시, Desktop, Tablet, Mobile 등 모든 장비에서 웹사이트가 잘 보이게 됨 ② 사용방법1 : 직접 링크 (Include.. 2022. 6. 22.
22. JavaScript, 총정리 (회원가입) ○ JavaScript - JavaScript (또는 jQuery)를 사용하는 이유 ① Frontend(UI, View)단에서 서로 다른 문법(이종)간의 데이터를 교류하기 위해 ② 데이터의 유효성을 검증하기 위해 ○ JavaScript를 이용한 회원가입 폼 1) 회원가입 폼 회원가입 아이디 : 비밀번호 : 주민번호 : - 약관동의 : 2) JavaScript ① 에 접근해 보기 // 1) 의 컨트롤요소 접근시 name 사용(비추) alert(document.memfrm.uid.value); // 2) 의 컨트롤요소 접근시 id 사용(추천) alert(document.getElementById("uid").value); //text에 입력한 내용이 value // 3) tag name으로 접근 (본문에서 .. 2022. 6. 21.
21. JavaScript, style접근 ○ 자바스트립트에서 스타일 접근 - 참고 : jQuery에서 스타일 접근 대한민국 1) 순수 자바스크립트 접근 : document.getElementById("요소의 id").style - document.getElementById("요소의 id").style.스타일속성 - 스타일에 접근해서 수정하기 2) jQuery에서 스타일 접근 : $("요소의 식별자").css() → 추천 2022. 6. 21.
20. JavaScript, this ○ this - 자기자신의 요소를 가리킴 (참조: jQuery this / 비교: JAVA this ) - 폼 컨트롤 요소에서만 사용 가능 - CSS, HTML, jsp 등 여러 언어를 혼용할 때 JavaScript가 중개자 역할을 함 이때, this는 접근경로를 단순화 해주기 위해 사용함 ○ this로 요소 접근하기 - this : 자신의 요소 - this.value : 자신의 요소가 가지고 있는 실제 값 - this.form : 자신의 요소가 속해 있는 폼 this - value="버튼1" - front단에서는 id, 서버에 전송되면 name으로 접근하는 것이 일반적 function test1(){ //1) name접근 var f=document.myform; alert(f); //[object HT.. 2022. 6. 20.
19. JSON (JSON 기본구조, XML, JSON 관련함수) ○ JSON - JavaScript Object Notation - 비동기식 통신(문자단위 통신)에서 XML을 대체하는 포맷이다 - AJAX, NoSQL DB 등에서 주로 사용되는 포맷(표기법) - 배열을 객체화 ○ JSON 기본구조 - 속성:값 쌍으로 데이터가 구성되어 있다 - 속성(name, property, key), 값(value) - name구성시 " '기호는 생략가능하다 - {}안에 데이터를 저장한다 - 형식) {name:value, "name":value, 'name':value, ~~~} {driver:"OracleDriver", "username":"system", 'password':1234} ○ XML 문법 - 여는 태그와 닫는 태그로 구성 (반드시 둘 다 있음) - custom ta.. 2022. 6. 19.

티스토리툴바