1. 사용자 동작에 따라 반응하는 가상 클래스 사용자가 웹 요소를 클릭하거나 마우스 포인터를 올려놓는 등 특정 동작을 할 때 스타일이 바뀌도록 만들고 싶다면 가상클래스 선택자를 사용한다. 1️⃣ : link 가상 클래스 선택자 방문하지 않은 링크에 스타일을 적용한다. 2️⃣ : visited 가상 클래스 선택자 방문한 링크에 스타일을 적용한다. 3️⃣ : hover 가상 클래스 선택자 특정 요소에 마우스 포인터를 올려놓으면 스타일을 적용한다. 4️⃣ : active 가상 클래스 선택자 웹 요소를 활성화했을 때 스타일을 적용한다. 5️⃣ : focus 가상 클래스 선택자 웹 요소에 초점이 맞춰졌을 때 스타일을 적용한다. 2. 요소 상태에 따른 가상 클래스 1️⃣ : target 가상 클래스 선택자 다른 사..

html 태그 작성할 때 속성도 많이 사용하는데 그 속성값에 따라 원하는 요소를 선택할 수도 있다. 1. [속성] 선택자 (해당 속성이 있는 경우) 대괄호 사이에 원하는 속성을 입력하면 된다. 2. [속성 = 속성값] 선택자 ( 지정한 속성값이 있는 경우) 특정 속성값이 있는 요소를 선택하는 [속성 = 속성값] 선택자는 주어진 속성과 속성값이 일치하는 요소를 찾아 스타일을 지정하는데 사용한다. 3. [속성 ~= 속성값] 선택자 (지정한 속성값이 포함된 요소-단어별) [속성 ~= 속성값] 선택자는 여러 속성값 중에서 해당 속성값이 포함된 요소를 선택한다. 특정 속성값을 찾는데 편하다. [속성 ~= 속성값] 선택자는 button값과 정확하게 일치하는 요소를 선택한다. 4. [속성 |= 속성값] 선택자 (지정..

특정 요소를 기준으로 그 안에 포함된 요소를 하위 요소라고 한다. 그리고 현재 요소를 기준으로 바로 한 단계 아래 요소를 자식 요소라고 한다. 그 자식 요소의 한 단계 아래는 손자 요소라고 한다. 1. 하위 선택자 하위 선택자 descendant selector 를 사용하면 부모 요소에 포함된 하위 요소를 모두 선택하며 자손 선택자라고도 한다. 즉, 자식 요소뿐만 아니라 손자 요소, 손자의 손자 요소 등 모든 하위 요소까지 적용된다. 하위 선택자는 공백을 사이에 두고 써주면 된다. 2. 자식 선택자 자식 선택자 child selector는 하위 선택자와 다르게 자식 요소에만 스타일을 적용하는 선택자이다. '>' 기호로 표시해 부모 요소와 자식 요소를 구분한다. ❗ 하위 선택자와 자식 선택자의 다른점은 하..

1. group by select 필드명 from 테이블명 where 조건식 group by 필드명1, 필드명2, ... having 그룹 내 조건식; 2. distinct distinct 구문은 나열한 필드 값을 중복 없이 구한다. select distinct 필드명 from 테이블 명 where 조건; 3. join ⭐⭐⭐⭐⭐ select * from 학생테이블 a join 학생테이블 b on a.학생 코드 = b.학생코드 ; 1️⃣ join : 기준 테이블과 대상 테이블에 매칭하는 필드값이 있는 경우에 검색한다. 2️⃣ left join : 기준 테이블의 모든 필드값을 보이고 대상 테이블에 매칭하는 필드값이 있는 경우에 검색하고, 그렇지 않으면 공백으로 보인다. 3️⃣ right join : 대상 ..

정말 기초적인 데이터베이스 명령어를 정리해봤다. 1. select select 필드명 form 테이블명; 이 형식이 기본이다. ex) select * from tb_customer; 하면 tb_customer 테이블의 전체를 보여준다. select 필드명 as '별명' form 테이블명; 하면 필드명을 '별명'으로 바꿔서 나타낼 수 있다. 이때 별명에 공백을 포함한다면 따옴표를 사용해줘야한다. 2. where select 필드명 from 테이블명 where 조건; 3. and select 필드명 from 테이블명 where 조건1 and 조건2 ...; 4. or select 필드명 from 테이블명 where 조건1 or 조건2 ...; * and , or 혼합 5. between A and B.. s..

oracle과 mariadb의 명령어들이 조금 다른데 그중 하나가 테이블 목록 조회하는 방법이다. mariadb에서 show tables; 하면 바로 나와서 그대로 입력했더니 에러문이 나왔다. 그럼 어떤 명령인지 찾아보니 이렇게 입력하면 된다. 이런식으로 확인할 수 있다.

오라클을 설치하고 나서 바탕화면에 이런 아이콘이 생기는데 이걸 클릭해서 기본적인 db 설정을 해줘야하는데 오류가 생겼다..! 127.0.0.1:%HTTPPORT%/apex/f?p=4950을(를) 찾을 수 없습니다. 라는 오류가 떴는데 이에 대한 해결 방법이다. 우선 나는 톰캣에서 8080 포트번호를 쓰고 있기 때문에도 오류가 발생했다고 생각한다. 따라서 톰캣을 8080 쓰고, 오라클을 9090으로 지정해줄 예정이다. 우선 cmd에서 sqlplus 명령을 입력한다. 그 후엔 이런 메시지를 확인할 수 있다. 비밀번호를 입력해주고, 접속이 되면 먼저 1️⃣SELECT DBMS_XDB.GETHTTPPORT() FROM DUAL; 명령을 통해 기본 포트를 확인한다. 8080으로 설정되어있다. 2️⃣EXEC DBM..

항상 mariadb를 사용해오다가 갑자기 시험이 오라클로 나온다해서 오라클을 설치부터 해서 다시 오라클로 공부를 해보려고 한다! 크게 다르지는 않지만 가끔 쿼리문이 다를 때가 있어서 시험을 위해 오라클에 익숙해지는게 좋을 듯! 하다. 1. 오라클 설치 url https://www.oracle.com/database/technologies/xe-prior-release-downloads.html 나는 오라클 XE 버전을 다운받을 것이다! XE 는 개인 컴퓨터에 설치하는 교육용 버전의 오라클로, 간단한 데이터베이스 관리 프로그램을 제공한다. 아마 교육용 말고는 유료였던거 같은데 .ㅁ. 나는 이걸 다운받았다. 대부분 11g 버전을 다운 받는 것 같다. 최신 버전은 19버전? 까지 나와있는것 같긴하다. 설치할 ..

* 연습문제 1 웹 디자인 트렌드를 따라잡는 비법 대공개! 그래픽 프로그램으로 웹 디자인 요소를 일일이 만들어 웹사이트를 제작하는 시대는 지났다. 이제 모바일, 태블릿, PC 등 멀티 디바이스에 한 번에 적용할 수 있는 웹 디자인 방법을 알아야 한다. 바로 코딩을 이용한 웹 디자인이다. * 연습문제 2 웹 디자인 트렌드를 따라잡는 비법 대공개! 그래픽 프로그램으로 웹 디자인 요소를 일일이 만들어 웹사이트를 제작하는 시대는 지났다. 이제 모바일, 태블릿, PC 등 멀티 디바이스에 한 번에 적용할 수 있는 웹 디자인 방법을 알아야 한다. 바로 코딩을 이용한 웹 디자인이다. * 연습문제 3 대학언론사 수습기자 모집 신입생 여러분을 기다립니다 모집분야 아나운서(0명) : 학내 소식을 라디오 방송으로 보도 오프닝..

1. 선형 그라데이션 선형 그라데이션이란 색상이 수직, 수평 또는 대각선 방향으로 일정하게 변하는 것을 말한다. linear-gradient 는 색상이 어느 방향으로 바뀌는지 그리고 어떤 색상으로 바뀌는지 알려줘야한다. linear-gradient ( to 또는 , , ...); 1️⃣ 방향 : 그라데이션 방향을 지시할 때는 끝 지점을 기준으로 to 예약어와 함께 사용한다. 예약어는 최대 2개까지 사용가능하다. 예약어는 수평 방향 left, right 수직 방향 top, bottom ex) 왼쪽에서 오른쪽 : to right 왼쪽 아래에서 오른쪽 위 : to right top 2️⃣ 각도 : 각도는 선형 그라데이션에서 색상이 바뀌는 방향을 알려주는 방법이다. 각도는 그라데이션이 끝나는 부분이고 값은 de..

1. background-image background-image 는 웹 요소에 배경 이미지를 넣을 때 사용하는 속성이다. background-image : url ('이미지 파일 경로') 이미지 파일 경로는 현재 웹 문서 기준으로 상대 경로를 지정하거나, http:// 로 시작하는 절대 경로를 사용할 수도 있다. 2. background-repeat background-repeat 은 배경 이미지의 반복 방법을 지정하는 속성이다. background-repeat 속성값 1️⃣ repeat : 브라우저 화면에 가득 찰 때까지 가로와 세로로 반복한다. (기본값) 2️⃣ repeat-x : 브라우저 화면 너비에 가득 찰 때 까지 가로로 반복한다. 3️⃣ repaet-y : 브라우저 화면 너비에 가득 찰 때 ..

1. backgroud-color background-color : 배경색을 지정하는 속성이다. background-color 는 앞에서 설명한 16진수나 rgb값 또는 색상 이름을 사용해서 지정한다. 어떤 방법을 사용할지는 사용자가 선택하기 나름으로 색상을 세밀히 조절하고 싶다면 16진수값을 사용하고, 투명도도 함께 조절하고 싶다면 rgba 표기법을 사용한다. 2. background-clip background-clip : 배경색의 적용 범위를 조절하는 속성이다. 박스모델 관점에서 배경의 적용 범위를 조절할 수도 있다. 박스모델의 가장 외곽인 테두리까지 적용할지, 테두리를 빼고 패딩 범위까지 적용할지, 아니면 내용 부분에만 적용할지 선택할 수 있다. backgroud-clip 속성값 1️⃣ borde..