본문 바로가기

Programming

 (477)
[CSS] 7. 가상 클래스와 가상 요소(3) - 구조 가상 클래스 2 앞서 살펴본 구조 가상 클래스와 관련된 내용을 계속해서 살펴보도록 하겠습니다. [CSS] 7. 가상 클래스와 가상 요소(3) - 구조 가상 클래스 1 이번에는 구조 가상 클래스에 대해서 살펴보도록 하겠습니다. 일단, '구조 가상 클래스'의 정의에 대해서 간단하게라도 살펴봐야 하겠죠? 구조 가상 클래스라 함은, 웹 문서의 전체적인 구조를 nozeroslope.tistory.com ○ 가상 요소 가상 클래스를 통해서는, 웹 문서의 여러 가지 요소 중에서 특정한 요소를 선택할 수 있었습니다. 가상 요소는 비슷해 보이지만 그 개념과 활용이 조금 다르죠. 가상 요소는 불필요한 태그를 적용하지 않아도, 특정한 부분에 스타일을 적용해 꾸밀 수 있도록 하고자 사용되는 것입니다. 개념이 조금 복잡하죠? 대표적으로 아래의..
람다식(4) - 표준 API의 함수적 인터페이스 6 : Predicate Functional Interface Predicate 함수적 인터페이스는, 파라미터의 값을 조사하여 boolean 값을 리턴하는 메서드를 가지고 있습니다. 대부분 testXXXX( ) 형태의 메서드이죠. 이 인터페이스의 추상 메서드들도 한번 아래와 같이 알아보도록 하겠습니다. 인터페이스 명 추상 메서드 설명 Predicate boolean test(T t) 객체 T를 조사한다. BiPredicate boolean test(T t, U u) 객체 T와 U를 비교해 조사한다. DoublePredicate boolean test(double value) double 값을 조사한다. IntPredicate boolean test(int value) int 값을 조사한다. LongPredicate boolean test(long value) lon..
[CSS] 7. 가상 클래스와 가상 요소(3) - 구조 가상 클래스 1 이번에는 구조 가상 클래스에 대해서 살펴보도록 하겠습니다. 일단, '구조 가상 클래스'의 정의에 대해서 간단하게라도 살펴봐야 하겠죠? 구조 가상 클래스라 함은, 웹 문서의 전체적인 구조를 기준으로 잡고, 이 안에서 특정한 위치에 있는 요소를 골라서 스타일을 적용하는 가상 클래스 선택자입니다. 여기서 살펴볼 내용이 바로, 위에서 언급한 [특정한 위치]를 정의하는 방식이 되는 것이죠. ○ 특정 위치의 자식 요소 선택 우리는 앞서 살펴본 방식에 따라, class 또는 id를 사용하여 특정한 웹 문서의 요소를 선택하고 스타일을 적용해 왔습니다. 그런데 여러가지 요소가 뒤섞여 여러 개 나열되어 있는 경우에는 요소의 배치 '순서'를 통해서 스타일을 적용할 수 있습니다. 즉, "n번째 요소에만 스타일을 적용해라."라..
람다식(4) - 표준 API의 함수적 인터페이스 5 : Operator Functional Interface 2 앞선 아티클에서 Operator Functional Interface의 여러 종류를 살펴보았습니다. 람다식(4) - 표준 API의 함수적 인터페이스 5 : Operator Functional Interface 1 Operator 함수적 인터페이스에 대해서도 살펴보겠습니다. 사실, Operator 함수적 인터페이스의 경우 직전에 살펴보았던 Function 함수적 인터페이스와 공통점이 있습니다. 바로 추상 메서드가 applyxxx( ) nozeroslope.tistory.com 패턴 자체는 반복되고 있으므로 혹시라도 이해가 가지 않으신다면(중간에 오랜 기간 공부를 멈춰서 잊으셨다면) 아래 람다식 기본 개념을 다시 잘 숙지하시기 바랍니다. 람다식의 가장 기본 원리를 다시 상기하고 난 이후라면 반복되는 응용 패..
[CSS] 7. 가상 클래스와 가상 요소(2) - 요소 상태에 따른 가상 클래스 2 ○ :checked - "선택한 항목"에 대해서 스타일을 적용 우리가 어떤 form의 라디오 버튼, 체크 박스에서 특정 항목을 선택할 경우 이 요소에는 checked라는 속성이 추가됩니다. 그래서 이러한 checked 속성이 부여된 요소에 스타일을 적용할 때는 :checked선택자를 사용하게 됩니다. '라디오 버튼을 클릭했을 때 레이블에 적용된 스타일을 변경한다'라고 정의하게 되면, 다음 예시와 같이 사용하게 됩니다. 참고로 이번 예시에서는 adjacent selector(인접 형제 선택자)를 사용하게 됩니다. 이 선택자의 정의가 기억나지 않으신다면, 아래 아티클에서 다시 복습하시기 바랍니다. [CSS] 6. 고급 선택자(1) - 연결 선택자 2 연결 선택자(selector) 중에서 이번에는 형제 관계로..
람다식(4) - 표준 API의 함수적 인터페이스 5 : Operator Functional Interface 1 Operator 함수적 인터페이스에 대해서도 살펴보겠습니다. 사실, Operator 함수적 인터페이스의 경우 직전에 살펴보았던 Function 함수적 인터페이스와 공통점이 있습니다. 바로 추상 메서드가 applyxxx( ) 형태로 이루어져 있고, 이 메서드는 파라미터와 리턴 값을 모두 갖습니다. 하지만, Function 함수적 인터페이스와 결정적인 차이가 있습니다. Function 함수적 인터페이스의 추상 메서드들은 주요한 목적이 파라미터를 통해 값을 받고, 리턴 값의 데이터 타입으로 매핑(타입을 변환)하는 역할을 수행한다고 했습니다. 하지만 Operator의 추상 메서드는 주요 목적이 파라미터의 값을 받고, 그 값으로 연산을 수행하고 동일한 타입으로 리턴 값을 제공하는 것입니다. Function과는 구..
[CSS] 7. 가상 클래스와 가상 요소(2) - 요소 상태에 따른 가상 클래스 1 ○ :target - 앵커 대상에 스타일 적용 앵커(anchor)는 같은 문서 내에서, 다른 위치로 이동할 때 사용하는 요소입니다. 를 사용할 때 외부 링크 이동을 위해 URL을 요소 속성 값으로 입력하게 되는데, 여기에 속성 값으로 특정 id를 '#news' 같은 형태로 작성하게 되면 이 링크를 클릭했을 때 한 번에 해당 영역으로 이동하게 됩니다. 이제 스타일 태그나 CSS에서, 특정 id에 ':target' 가상 클래스를 추가하여 스타일을 선언한다면, 해당 앵커 영역으로 이동을 진행하게 되는 대상 id 영역에 스타일을 적용하게 됩니다. 예제를 통해서 살펴보도록 하겠습니다. 회사 소개 서비스 소개 결제 및 환불 문의하기 회사 소개 Excepteur do est eiusmod nulla et veniam..
람다식(4) - 표준 API의 함수적 인터페이스 4 : Function Functional Interface 2 지난 아티클에서 Function 함수적 인터페이스에 대해서 살펴보았습니다. 이번 아티클에서는 Student라는 예제 클래스를 사용해 이 Function 함수적 인터페이스의 사용 예시를 만들어 보겠습니다. 람다식(4) - 표준 API의 함수적 인터페이스 4 : Function Functional Interface 1 이번 아티클에서는 Function 함수적 인터페이스에 대해서 살펴보겠습니다. Function 함수적 인터페이스의 특징은, 파라미터 값을 받아 리턴 값으로 타입 변환(매핑)하는 역할을 한다는 점입니다. 즉, nozeroslope.tistory.com 우선 아래와 같이 Student 클래스를 선언합니다. public class Student { private String name; private ..

티스토리툴바