본문 바로가기

Programming

 (80)
[CSS] 왼쪽에서 오른쪽으로 서서히 나타나는 애니메이션 구현하기 홈페이지에 들어왔을 때, 메인을 차지하는 글씨가 왼쪽에서 오른쪽으로 서서히 나타나게 하고 싶었다. 그래서 사용한 방법이 animation! 처음 구현할 땐, 연습용 div가 나타났다가 사라지기도 하고, 생각처럼 간단하게 되지 않아서.. 다음을 위해 정리해보았다. 서서히 나타나는 애니메이션 구현하기 왼쪽에서 오른쪽으로 이동 : from left 10px > to left 50px 서서히 나타남 : opacity 0 > opacity 1 애니메이션 이름(animation-name) : anime 애니메이션 동작 시간(animation-duration) : 1.5s 애니메이션 동작 전후 설정(animation-fill-mode) : forwards (애니메이션이 끝난 후 그 지점에 그대로 있음) 애니메이션 시..
[Java] 정규 표현식을 이용한 개인정보 마스킹 처리 개인정보 보안 이슈에 대하여 마스킹 처리 구현을 맡았다. 마스킹 처리에는 다양한 방법이 있겠지만, 정규 표현식에 대해 공부도 해볼겸! 이를 활용해서 마스킹 처리를 해보았다. 정규 표현식을 이용한 개인정보 마스킹 처리 핸드폰 번호 마스킹 입력 문자열의 형식이 {2~3}-{3~4}-{4}자릿수이고, '-'(하이픈)이나 ')'(괄호)가 있으나 없으나 숫자 길이와 형식이 맞다면, 가운데 자리와 마지막 자리의 첫 번째 글자까지 마스킹 처리한다. * 정규식 문법 : \d는 숫자를 의미, {} 안의 숫자는 개수를 의미한다. import java.util.Arrays; import java.util.regex.Matcher; import java.util.regex.Pattern; public class Main { ..
[Oracle SQL] 반올림 ROUND, 올림 CEIL, 내림 FLOOR, 버림 TRUNC 반올림 ROUND ROUND(number), ROUND(number, integer) 소수점 이하 자릿 값을 반올림하여 정수를 반환하거나, 지정된 자릿수까지 반올림해준다. SELECT ROUND(3.15)-- 3 , ROUND(3.56)-- 4 , ROUND(3.56, 1)-- 3.6 FROM DUAL 올림 CEIL CEIL(number) 소수점 이하 자릿 값을 올림하여 정수를 반환한다. SELECT CEIL(3)-- 3 , CEIL(3.1)-- 4 , CEIL(3.15)-- 4 , CEIL(3.6) -- 4 FROM DUAL 내림 FLOOR FLOOR(number) 소수점 이하 자릿 값을 내림하여 정수를 반환한다. SELECT FLOOR(3)-- 3 , FLOOR(3.1)-- 3 , FLOOR(3.15..
[CSS] white-space : 레이아웃에 맞춰 텍스트 줄바꿈(개행) 하기 white-space 내가 지정한 width 값에 대하여 그 하위 텍스트의 공백과 개행 처리를 위해 사용하는 방법이다. white-space 속성 속성 의미 normal 연속된 공백과 줄바꿈을 공백으로 표시하고, 줄바꿈 함 nowrap 연속된 공백을 하나로 표시하고, 줄바꿈 하지 않음 pre 연속된 공백을 그대로 표시하고, 줄바꿈 하지 않음 pre-wrap 연속된 공백을 그대로 표시하고, 줄바꿈 함 pre-line 연속된 공백을 하나로 표시하고, 줄바꿈 함 코드 예시 white-space: pre-line; 전체 코드 Lorem ipsum dolor sit amet, consectetur adipisicing elit. .white-space { width: 200px; height: 200px; bac..
[CSS] text-overflow : 내용이 레이아웃 범위를 벗어날 때 말줄임(...) 표시하기 text-overflow 내가 지정한 width 값에 대하여 그 하위 텍스트가 범위를 벗어날 때 사용하는 방법이다. text-overflow 속성 속성 의미 clip 바깥으로 나오는 기본 값 ellipsis 내용이 넘어가면 ... 표시해줌 코드 예시 text-overflow: ellipsis; 전체 코드 Lorem ipsum dolor sit amet, consectetur adipisicing elit. .overflow { width: 200px; background-color: skyblue; white-space: nowrap;// 줄바꿈을 하지 않고 한 줄로 표시 text-overflow: ellipsis;// 레이아웃을 넘어갈 때 ... 표시 overflow: hidden;// 레이아웃을 넘어..
[Oracle SQL] ROWNUM : 상위 n개 데이터 조회하기 ROWNUM : 상위 n개 데이터 조회하기 ROWNUM은 오라클 데이터베이스의 조회 결과에 대해서 논리적인 일련번호를 부여한다. 즉, 조회되는 행 수를 제한하며 화면에 원하는 행만큼 조회할 수 있다. (MySQL에서는 LIMIT 구문을 사용) 예제 ANIMAL 테이블에서 상위 3개 데이터만 조회해야 한다. SELECT * FROM ANIMAL WHERE ROWNUM
[Oracle SQL] OUTER JOIN (외부 조인)과 UNION (합집합) 차이 SQL을 공부하던 중에 FULL OUTER JOIN과 UNION ALL이 같은 게 아닌가했다. 둘다 모든 데이터를 조회하는 것이라고 생각했는데.. 아니였다! 그래서 정리해보았다. 결론부터 말하자면! (FULL) OUTER JOIN은 열의 합집합, UNION (ALL)은 행의 합집합이라고 할 수 있다. (FULL) OUTER JOIN OUTER JOIN은 서로 다른 두 테이블을 연결하여 컬럼을 확장하는 것이다. UNION (ALL) UNION은 동일 컬럼을 가지는 두 테이블을 하나로 합치는 것이다. 이 때, UNION ALL은 두 테이블의 행(Row)들을 모두 합쳐서 보여주는것인 반면에, UNION은 값이 중복되는 행(Row)들을 제거하고 보여준다는 차이점이 있다.
[Oracle SQL] JOIN 종류와 과정 설명 (INNER JOIN, OUTER JOIN) JOIN 종류 JOIN 종류는 크게 INNER JOIN(내부 조인)과 OUTER JOIN(외부 조인)으로 나뉜다. 그리고 해당 조인에 대하여 다양한 조인 방식이 있다. INNER JOIN : INNER JOIN, EQUI JOIN, NON-EQUI JOIN, NATURAL JOIN, CROSS JOIN OUTER JOIN : LEFT OUTER JOIN, RIGHT OUTER JOIN, FULL OUTER JOIN INNER JOIN 조인 조건구에 따라 두 테이블의 컬럼값이 일치하는 경우를 조회한다. INNER JOIN ON문을 사용해서 테이블을 연결하여 컬럼값이 일치하는 경우를 조회한다. (INNER 생략 가능) SELECT * FROM A a JOIN B b ON a.ID = b.ID EQUI JOI..

티스토리툴바