정렬 4

원하는 열만 조회하고 정렬하기

SELECT 문을 이용하여 특정 테이블에서 원하는 열만 조회하기SELECT 문을 사용하면 테이블에서 특정 열(column)의 내용만 조회가 가능합니다. 예시>SELECT 문을 이용해 employee_id와 first_name과 last_name을 선택하여 직원들의 사원번호화 이름을 출력 [입력]SELECT employee_id, first_name, last_name FROM employees; [실행결과] SELECT 명령문 뒤에 나열한 열 이름 순서대로 결과과 조회된 것을 확인할 수 있습니다. 열(column) 이름은 쉼표(,)를 붙여 계속해서 나열할 수 있으며 결과는 나열한 순서대로 출력됩니다. 모든 열을 조회하는 * 대신 열(column) 이름을 모두 나열해도 같은 결과가 출력됩니다. 출력결과를 ..

STUDY/SQL 2021.02.23

[CSS] 수직 가운데 정렬

[개요] 아래와 같은 디자인의 CSS 작성방법입니다. [예시] [결과] 좌우로 배치하는 것은 float와 clear를 이용하면 구현할 수 있습니다. 가운데 정렬 또한 텍스트이기 때문에 text-align 속성을 이용하면 됩니다. 하지만 수직 가운데 정렬은 아래와 같이 구현할 수 있습니다. [padding] 첫번째로 많이 사용되는 방법은 padding을 이용한 방법입니다. 상하 여백이 얼마인지 아는 경우라면 그에 맞춰서 텍스테에 상하 padding을 주면 됩니다. [예시] [결과] [line-height] line-height는 본래 줄 간격을 나타내는 매트릭이지만, 인라인 요소의 수직 가운데 정렬을 구현하기 위해서도 널리 이용됩니다. 이 값은 160%, 1.8 등 비율로도 표현할 수 있지만 px단위로도 ..

STUDY/디자인 2020.12.18

[CSS] 수평 가운데 정렬

[left와 margin-left] absolute position의 left와 margin-left 속성을 잘 이용하면 이를 구현할 수 있습니다. left를 일단 50%주고, width의 절반만큼 더 왼쪽으로 이동시키면 됩니다. HTML 요소의 좌표계는 중앙이 아닌 좌상단이기 때문입니다. margin-left 속성은 신기하게도 음수 값을 주면 그 값만큼 요소를 왼쪽으로 이동시킵니다. 이 특징을 이용하면 left:50%, margin-left:-{width/2} 의 값을 주면 가운데 정렬이 된 것처럼 보입니다. 단 width를 동적으로 가져와 절반 만큼 사용하는 방법은 일반적으로 존재하지 않습니다. 직접 width와 padding을 계산해서 적어주어야 합니다. 또 absolute 요소는 부모의 heigh..

STUDY/디자인 2020.12.17