본문 바로가기

Programming

 (469)
[CSS] 5. 배경 이미지와 그라데이션(2) - background image 2 ○ background-position : 배경 이미지 위치 조정 배경 이미지로 적용된 이미지들 역시 background-position 속성 값을 부여함으로써, 수평 or 수직으로 위치를 이동할 수 있습니다. 우선, 기본적인 속성 값의 적용 형태는 아래와 같습니다. 선택자 { background-position: } 속성 값으로 두 개의 값을 부여하면 각각 수평, 수직 값으로 인식됩니다. 만일 한 개의 값만을 입력한다면 브라우저에서 해당 속성 값을 수평 값으로 인식하고 수직 위치는 50%나 center로 인식하게 됩니다. background-position의 속성 값으로는 키워드 / 백분율 / 크기 값을 각각 입력이 가능합니다. 각각의 속성 값의 종류에 대해서도 살펴보겠습니다. 우선 키워드는 말 그대로..
제네릭(4) - 제한된 타입 파라미터 선언 앞선 내용까지 학습하면서, 타입 파라미터 ( )에 타입을 선언하여 상황에 맞게 사용하는 케이스를 살펴보았습니다. 그런데 이런 타입 파라미터를 무작정 아무 타입이나 사용 가능하게 만들어두는 경우는 많지는 않을 것입니다. 구체적으로 어떤 카테고리의 타입을 사용해야 할지 여부를 정할 필요가 있는 것이죠. 예를 들어서, 여러 타입을 넣을 수는 있지만 - 숫자 - 즉 Number 타입이나 하위 클래스 타입(Byte, Short, Integer, Long, Double)만 사용해야 하는 숫자 연산용 제네릭 메서드를 선언하는 경우가 있겠지요. '제한된 타입 파라미터(Bounded type parameter)'를 통해 타입 파라미터를 선언하여, 상위 타입을 함께 선언하여 타입 파라미터의 선언 가능한 타입을 제한할 수 ..
[CSS] 5. 배경 이미지와 그라데이션(2) - background image 1 ○ background-image : 배경 이미지 삽입 우선 HTML 문서에 배경을 넣는 가장 기본적인 스타일 속성 작성 방식을 살펴보겠습니다. 우선 background-image 속성에 url 키워드를 사용하게 됩니다. 기본형은 다음과 같습니다. 선택자 { background-image: url('이미지 경로'); } 위에서 사용하는 이미지 경로는, 상대 경로 혹은 절대 경로를 사용할 수 있습니다. 이미지의 경우 jpg, gif, png 형식을 사용하게 됩니다. 여기까지는 사용에 큰 문제가 없을 텐데, 화면을 채우는 방식을 주의깊게 살펴보아야 합니다. ○ background-repeat : 배경 이미지 반복 배치 예를 들어 다음과 같이 특정 이미지를 배경으로 지정했다고 가정해 보겠습니다. 그러면 해당 ..
제네릭(3) - 제네릭 메서드 3 제네릭 메서드에 대한 예제를 계속해서 살펴보고 있습니다. 이번에는 멀티 파라미터 타입을 사용하는 경우의 제네릭 메서드 사용에 대해서 살펴보겠습니다. 우선, 멀티타입 파라미터를 사용하는 제네릭 타입(클래스) Pair를 선언합니다. public class Pair { private K key; private V value; // 생성자 public Pair(K key, V value) { this.key = key; this.value = value; } // Setter public void setKey(K key) { this.key = key; } public void setValue(V value) { this.value = value; } // Getter public K getKey() { ret..
[CSS] 5. 배경 이미지와 그라데이션(1) - background color & clip ○ background-color 속성 : 배경색 지정 HTML 문서의 배경색을 정하고 싶다면, background-color 속성에 16진수, 색상 이름, RGB 값 등을 입력해 색상을 지정할 수 있습니다. 당연히 투명도(알파)를 적용하기 위해서는 RGBA 등의 속성 값을 사용하면 됩니다. 크게 어려울 것은 없는 부분입니다. 선택자 { background-color: #008000; background-color: rgb(0,120,1); background-color: green; } 다만, 부모-자식 요소 간의 스타일 상속과 관련해 예외사항이 하나 있습니다. 바로 background-color 속성은 상속 대상이 아니라는 점입니다. 예를 들어서 폰트, 글자 크기 등의 속성을 태그에 적용하면 모든 웹..
제네릭(3) - 제네릭 메서드 2 앞서서 제네릭 메서드 선언 방법에 대해서도 살펴보았습니다. 이제 이번 아티클에서는 본격적으로 제네릭 메서드를 선언하고, 실행 클래스에서 사용하는 방식에 대해서 예제를 실습해 보겠습니다. 우선 Box라는 클래스가 정의되었다고 가정합시다. 앞서 살펴본 패턴이기는 하지만, 다시 한번 잘 살펴보도록 합시다. getter와 setter를 가지고 있는 제네렉 타입(클래스)입니다. public class Box { private T t; public T get() { return t; } public void set(T t) { this.t = t; } } /* 다시 설명하자면, 위와 같은 제네릭 타입 클래스는 캐스팅 없이 사용할 수 있도록 일반적으로 Box box = new Box(); 형태로 선언해 사용한다. *..
[CSS] 4. 레이아웃 설계(3) - position과 위치 속성 4 : fixed, sticky 이제 길고 긴 position 속성 값을 알아보는 여정에도 끝이 보이고 있습니다. 고정형 타입인 fixed와 sticky에 대해서 알아보고 position 속성에 대한 내용을 마무리해보도록 하겠습니다. ▷ fixed 우리가 웹 페이지를 볼 때, 우측 하단에 '상담 채팅 연결하기', '이벤트 신청하기' 같은 작은 버튼이 고정된 위치에 출력되는 것을 보신적이 있을 것입니다. 이러한 버튼은 마우스로 페이지를 아무리 스크롤해도 핀으로 꽂아놓은 것처럼 고정되어 있다는 것이 특징입니다. 이 경우가 바로 position의 속성 값을 fixed로 사용했을 때 나타나는 특징입니다. fixed로 position을 설정하게 되면, 이 역시 기본적인 HTML의 요소 배치 컨텍스트에서 벗어나게 되고, 위치 요소(left, ri..
제네릭(3) - 제네릭 메서드 1 앞서 제네릭과 관련해서는 클래스의 선언, 그리고 해당 클래스의 인스턴스 생성 시점에 주로 사용되는 타입 파라미터 정의와 관련해서 제네릭 타입을 사용하는 유형을 중심으로 살펴보았습니다. 이번 아티클에서는, 메서드에서 타입 파라미터를 사용해 다양한 결과를 얻는 제네릭 메서드에 대해서 알아보도록 하겠습니다. · 제네릭 메서드는 파라미터 타입과 리턴 타입으로 타입 파라미터를 갖는 메서드를 의미합니다. · 제네릭 메서드를 선언하는 방법은 다음과 같습니다. - 메스드의 리턴타입 바로 앞에 를 추가하고 - 리턴타입과 파라미터 타입에 타입 파라미터를 사용합니다. // 제네릭 메서드 선언 유형 public 리턴타입 메서드명(파라미터,...) { ... } // 제네릭 메서드 예시 public Box boxing(T t)..

티스토리툴바