Life is Good

수콩이의 시선

분류 전체보기 57

[JS] 객체 조작 메서드 (html, text, attr, prop, val, prepend, append)

1. 속성 조작 메서드 : 요소의 속성을 바꿀 때 사용 2. 수치 조작 메서드 : 요소의 너비값 또는 높이 값 같은 수치를 바꿀 때 사용 3. 객체 편집 메서드 : 객체를 생성하거나 삭제 또는 복제할 때 사용 1. 속성 조작 메서드 - html() $("요소 선택").html : 선택한 요소의 하위 요소를 가져옴 $("요소 선택").html("새 요소"); : 선택한 요소의 하위요소를 모두 제거하고 그 위치에 지정한 새요소를 지정 - text() $("요소 선택").text : 선택한 요소가 감싸는 모든 텍스트를 가져옴 $("요소 선택").text("새 택스트") : 선택한 요소의 하위 요소를 모두 제거후, 그 위치에 새 텍스트 생성한다. - attr() : 선택한 요소에 새 속성을 생성하거나 기존의 속..

Coding/JAVASCRIPT 2022.05.20

[BS] Dropdown & Buttons

링크들의 목록을 보여주기 위한 토글 가능한 메뉴 만들기 dropdown 의 트리거와 메뉴를 .dropdown으로 둘러싼다. 드롭다운 메뉴는 부모에 .dropup을 추가하는 것으로 바뀌는 것이 가능합니다. Dropdown Action Another action Something else here Separated link Dropdown Action Another action Something else here Separated link - 정렬 드롭 다운 메뉴는 자동적으로 최상단에 위치한다. 우측 정렬하려면 .dropdown-menu에 .dropdown-menu-right 를 추가하면 된다. ... - 제목 (Header) 드롭다운 메뉴의 액션 그룹에 라벨을 붙이려면 헤더를 추가하라 ... Dropdow..

Coding/Bootstrap 2022.04.22

[BS] 코드와 테이블

코드 1) 인라인 로 짧은 코드를 감싸세요. For example, should be wrapped as inline. 2) 사용자 입력 키보드로 들어가는 입력을 나타내기 위해 를 사용하세요. To switch directories, type cd followed by the name of the directory. To switch directories, type cd followed by the name of the directory. To edit settings, press ctrl + , 기본 블록 여러행의 코드를 위해 를 사용하세요. 적절한 렌더링을 위해 어떤 꺽쇠 괄호는 부호화를 해야합니다. Sample text here... 당신은 선택적으로 .pre-scro..

Coding/Bootstrap 2022.04.22

[BS] 정렬 & 변형 클래스&약어&인용구&목록

1. 정렬 클래스 2. 변형클래스 Component의 text를 대문자 클래스로 변형시킴 (한글은 해당사항 없음) 3. 약어 1) 기본 약어 은 약어나 두문자어를 마우스를 올렸을 때 원래 텍스트를 보여주기 위한 요소이다. title 속성이 있는 약어는 점으로된 밑줄을 가지고 있고 마우스를 올렸을 때 물음표 커서가 보여지면 원래 텍스트를 보여줍니다. attr 2) 두문자어 미세하게 작은 (90%) 폰트크기를 가지려면 .initialism을 추가 3) 주소 4. 인용구 : 문서 안에 다른 출처로부터 인용한 컨텑츠 블록을 위해 사용한다. 1) 기본 인용구 2) 인용구 옵션 3) 다른 표시 5. 목록 1) 순서가 명확하지 않은 항목들의 목록 2) 순서가 명확하지 않은 항목들의 목록입니다. 3) 항목에서 list..

Coding/Bootstrap 2022.04.22

[BS] 타이포그래픽

본문 부트스트랩의 font-size 기본값은 14px 이고, line-height는 1.428 입니다. 와 모든 단락에 적용되는 수치로 는 행 높이의 절반의 마진을 가진다. 리드 문단 .lead 를 추가하여 문당을 눈에 띄도록 만들자 대체 요소 HTML5 에서 와 는 마음대로 사용해도 됩니다. 는 추가적인 중요성의 없이 단어나 구를 강조한다는데 의미가 있고, 는 거의 음성이나 기술적 용어 등에 쓰입니다.

Coding/Bootstrap 2022.04.22

[BS] Grid System

부트스트랩은 기기와 뷰 포트 크키가 증가하면서 12개의 열이 적절하게 확대되는 반응형, 모바일 우선 그리드 시스템입니다. 규칙들이 있는데 1. 행은 반드시 적절한 정렬과 패딩을 위해서 .container 나 .container-fluid 안에 위치해야 합니다. 2. 열들의 수평 그룹을 만드는데 행을 이용 3. 컨탠츠는 열 안에 위치해야 한다 그래야 열들이 행의 바로 아래에 올 수 있습니다. 4. 열은 padding으로 사이 간격을 둡니다. 행 내에서 첫 열과 마지막열을 위해 .row내에 음수 마진으로 offset이 되어있습니다. 5. 만약에 한 행에 12열 보다 많이 배치된다면 남은 열들은 하나의 유닛으로 새로운 라인 속으로 감싸집니다. 매우 작은 기기(모바일폰) 작은 기기(테블릿) 중간 기기(데스크탑)..

Coding/Bootstrap 2022.04.21

JavaScript의 이해 = 기본 문법 및 개념 /이벤트/함수(funtion)

JavaScript JavaScript는 웹페이지를 동적으로, 프로그래밍적으로 제어하기 위해서 고안된 언어다. 그렇기 때문에 오늘날 가장 중요한 플랫폼이라고 할 수 있는 웹브라우저에서 유일하게 사용할 수 있는 프로그래밍 언어이다. 최근에는 HTML5의 적용이 가속화되면서 지금까지 모바일 환경에서 네이티브 앱(안드로이드, IOS)으로 구현해왔던 기능이 웹에서도 대부분 구현할 수 있게 되고 있다. 웹이 크로스플랫폼이라는 점, 검색 가능하다는 점, 네이티브 디바이스를 제어할 수 있는 하드브리드 시스템(phonegap 등)이 존재한다는 점에서 웹의 중요함은 더욱 확대될 전망이다. 자연스럽게 웹에서 구동되는 유일한 언어인 JavaScript의 중요함도 점점 커질 것으로 예상된다. 1. HTML : 웹페이지를 제작..

Coding/JAVASCRIPT 2022.04.09

[JSTL] core,fmt

JSTL은 JSP개발할 때 간단하게 작성하기 위한 태그 라이브러리이다. core 태그 ${fruit} ${fruit} 는 apple 아님 ${"하하하"} 제어문 - choose/when ${fruit} ${fruit} ${fruit} 기타등등 반복문 - for ${i} 1~100배까지의 합:${tot} 자원추가시 값을 전달해주고 원하는 데이터 가져온다. 숫자를 문자열 변환 number: currency: percent: 문자열을 숫자 변환 ${isu} 날짜를 문자열 변환 날짜: 시간: 날짜시간: 날짜시간: 날짜시간: 패턴: 문자열을 날짜 변환

Coding/JSP 2022.04.09

[JSTL] functions

function tags 표준 함수를 제공한다. 대부분은 일반적으로 문자열 조작을 위한 함수이다. ${str1} ${str3} 1. 문자열길이: ${fn:length(str1)} 2. 대문자: ${fn:toUpperCase(str1)} 3. 소문자: ${fn:toLowerCase(str1)} 4. 문자열추출: ${fn:substring(str1,3,6)} 5. 문자열치환: ${fn:replace(str1, " ", "-")} 6. 문자열위치: ${fn:indexOf(str1, "t")} 7. 문자열1에서 문자열2에 포함되어 있는 문자열 이후: ${fn:substringAfter(str1, str2)} 8. 문자열1에서 문자열2에 포함되어 있는 문자열 이전: ${fn:substringBefore(str1,..

Coding/JSP 2022.04.09