본문 바로가기

전체 글

(70)
CSS 선택자4 일반 구조 선택자: 형제 관계에 있는 요소 중 특정 요소를 선택하는 선택자(중요) 위치를 기준으로 구분함:first-child:last-child:nth-child(수열):nth-last-child(수열) 테스트1 테스트2 테스트3 테스트4 테스트5 테스트6 /* 일반 구조 선택자 *//* first-child : 형제 관계의 요소 중 첫 번째 요소 */#test1 > p:first-child{ background-color: pink;}/* last-child : 형제 관계의 요소 중 마지막 요소 */#test1 > p:last-child{ background-color: tomato;}/* #test1 ..
CSS 선택자3 문자열 속성 선택자: 속성값의 문자열을 확인하여 스타일 적용하는 방식의 선택자1) 선택자[ 속성명 ~= "특정값" ]{ CSS코드; } → 띄어쓰기로 구분되어있는 여러 속성값이 작성된 속성 중     속성값이 특정값을 단어로 포함하는 요소를 선택2) 선택자[ 속성명 |= "특정값"]{ CSS코드; }→ 속성값이 특정값을 단어로 포함하는 요소를 선택    단, "-" 기호로 구분, "-" 앞의 내용이 동일해야함3) 선택자[ 속성명 ^= "특정값"]{ CSS코드; }→ 속성값이 특정값으로 시작하는 요소를 선택 ※ ^ : 캐럿4) 선택자[ 속성명 $= "특정값"]{ CSS코드; }→ 속성값이 특정값으로 끝나는 요소를 선택5) 선택자[ 속성명 *= "특정값"]{ CSS코드; }→ 속성값이 특정값을 포함하는 요소..
CSS 선택자2 기본 속성 선택자: 태그에 작성된 특정 속성을 선택하는 선택자(id, class도 선택 가능하지만, 보통 #, . 을 사용함)- [ 작성법 ]: 선택자[ 속성명 = "속성값"]{ CSS코드; }(참고 사항)1) 선택자는 생략 가능 → 특정 속성을 가진 모든 요소 선택2) "속성값" 양쪽의 쌍따옴표(" ")는 홑따옴표(' ')로 변경하거나 생략할 수 있음 div1 div2 div3 div4 p1 p2 p3 p4/* CSS 파일 파일 전체가 태그 내부라고 생각하면 됨 *//* 기본 속성 선택자 */div[name="name-1"]{background-color: aqua;}[name="name-2"]{background-color: antiquewhite;..
CSS 개요 / CSS 선택자-1 CSS(Cascading Style Sheets): 마크업 언어(HTML)가 실제로 화면에 표시되는 방법(색상, 크기, 스타일 등)을 기술하는 언어  ( == HTML 코드가 화면에 어떤 스타일로 보여질지 지정하는 언어) W3C(웹 표준 지정 기관)에서 CSS를 표준으로 지정함CSS Selector(선택자): 현재 HTML 문서 내에 같은 태그를 선택하는 선택자- [ 작성법 ]: 태그명{ CSS코드; } strong 태그에 작성된 내용입니다. span 태그에 작성된 내용입니다. strong 태그에 작성된 내용입니다. span 태..
글자 관련 태그 ▶ 글자 관련 태그 ~ 태그- 제목을 입력할 때 사용하는 태그- 1 ~ 6까지 여섯 단계의 폰트 크기가 지정되어 있음※ 해당 태그는 시작부터 종료까지가 하나의 문단이 됨== 종료 이후 줄바꿈 발생함기본글자크기h1 태그 작성 내용h2 태그 작성 내용h3 태그 작성 내용h4 태그 작성 내용h5 태그 작성 내용h6 태그 작성 내용p, pre 태그- p 태그(Paragraph : 단락, 문단): 글을 작성하는 용도의 태그: 종료 시 줄바꿈p태그 1번p태그 2번p태그 3번   - pre 태그(Preformatted)     : 글을 작성하는 용도의 태그     : 줄바꿈     : 시작, 종료 태그 사이에 작성된 문자열의 형식을 그대로 출력pre태그 1번pre태그 2번pre태그 3번▶ 글자 관련 기타 태그b..
형상 관리 시스템(Git) 개요 (Git, GitHub, repository, branch) ▶ 형상 관리란?형상 관리 : 소프트웨어의 변경 사항을 체계적으로 추적하고 통제하는 것형상 관리 시스템- 개발 중 발생하는 모든 산출물이 변경됨으로써 점차 변해가는 소프트웨어 형상을  체계적으로 관리하고 유지하는 시스템- 개발 산출물의 버전 관리와 변경 내역 조회 가능▶ Git대표적인 형상 관리 툴프로젝트(소스 코드)를 저장하고 이력을 관리하는 저장소(repository)원하는 시점에 소스 코드를 저장하거나 저장 지점으로 돌아가는 기능을 제공/ 프로젝트의 버전을 관리할 수 있음여러 PC에 소스 코드를 저장시키거나 여러 PC에서 작성한 내용을 하나로 병합(merge)하는 것이 가능▶ GitHub코드 저장소 Git을 웹으로 이용할 수 있게 만든 원격 저장소(remote repository)인터넷이 제공되는 ..
HTML5 개요 ▶ 개발환경 설정1) VS Code 설치VS Code 홈페이지(https://code.visualstudio.com/) 접속하여사용자 컴퓨터에 적합한 OS를 선택해 다운로드2) 환경 설정좌측 하단 톱니바퀴 아이콘 → Settingsfont 입력 → Font 설정 변경theme 입력 → 테마 설정 변경mouse wheel zoom 입력 → 빈 칸에 체크 (해당 설정 사용 시 마우스 휠로 글자 크기 증/감 가능)3) 확장 기능 추가좌측 사이드바 마켓 플레이스 아이콘(좌측 상단에서 아래로 5번째 위치) 클릭 및 확장기능 추가Korean Language Pack for Visual Studio code : VS code 한글화Auto Rename Tag : 시작태그, 종료태그 동시 수정Quick HTML Pre..
XML 기본 ▶ XML(eXtensive Markup Language) : 단순화된 데이터 기술 형식XML을 사용하려는 이유- DB 연결 정보, SQL문 등 수정이 빈번한 내용을 코드에 직접 작성하면 효율성 떨어짐- 이유) Java에서는 코드가 조금 수정되어도 전체 코드를 다시 컴파일하여 시간이 상대적으로 오래 소요됨- XML 외부 파일을 이용하면 XML 파일의 내용을 바꿔도 XML 파일을 읽어오는 코드는 변하지 않음- → 컴파일 미실행하여 시간 효율 상승함XML은 Key,Value 형식의 Map으로, 문자열만 저장Map == Properties 클래스Properties 컬랙션 객체1) Key, Value가 으로 타입이 제한된 Map2) XML 파일을 생성하고 읽어오는데 특화▶ CreateXML Classpubli..