수니리즘

    박스그림자 1

    [CSS3] text-shadow, box-shadow 글자와 박스에 그림자 생성하기

    text-shadow와 box-shadow를 이용하여 요소에 그림자를 추가해 주는 기능입니다. 포토샵에서의 drop-shadow와 비슷한 기능이라고 이해하면 될 것 같습니다. (1) text-shadow : 텍스트에 그림자 추가하기 text-shadow : 가로축거리 세로축거리 퍼짐도 색상; 다음의 예제를 통해 text-shadow의 사용법을 알아보겠습니다. TEST1 TEST2 2개의 태그를 이용하여 텍스트를 입력합니다. 태그에 공통으로 글자의 모양을 설정해 준 뒤, nth-child를 이용하여 text-shadow에 각기 다른 속성 값을 입력합니다. 첫 번째 태그에는 그림자의 가로축과 세로축 거리를 플러스 값으로, 두 번째 태그에는 마이너스 값으로 설정한 뒤, 퍼짐도 의 수치를 2배 정도 증가시킵니다..

    💕IT 공부하기/CSS3 2023.04.17
    이전
    1
    다음
    더보기

    공지사항

    • 2023년 정기 기사 제2회 필기시험 원서접수 관련 주요 안내사항
    • 분류 전체보기 (150)
      • 💜Health and Wellness💜 (18)
      • 💕IT 공부하기 (40)
        • 데이터베이스 (27)
        • CSS3 (13)
      • 💕자격증 정보 (51)
        • 기능사 (19)
        • 산업기사 (22)
        • 기능장 (4)
        • 관세사 (4)
        • 공인중개사 (1)
      • 💕꿈풀이 해몽읽기 (31)
      • 카페💕디저트 (9)
      • 💕동네맛집추천 (1)
      • 💕K디지털기초역량훈련 (0)
        • 웹퍼블리싱 (0)
        • UX·UI (0)
    반응형

    Copyright © Kakao Corp. All rights reserved.

    티스토리툴바