HTML 텍스트의 특수 효과

동영상: 알람시계효과 만들기!! 애니메이션(animation)효과 키프레임 /* @keyframes */ [HTML+CSS{코남}]

콘텐츠

낙하 모자
텍스트 롤링
제목 마우스 오버 (마우스 오버)

HTML 및 CSS는 글꼴 크기 및 배경색과 같은 표준 형식뿐만 아니라 멋진 텍스트 효과를 생성 할 수 있습니다. HTML의 특수 효과로 인해 텍스트가 표시되고 비정상적인 방식으로 동작하여 시청자의 시선을 사로 잡습니다. 이를 사용하여 중지 된 페이지에 애니메이션을 적용하거나 간단한 텍스트를 추가하십시오.

HTML 텍스트의 특수 효과 (폴카 도트 RF / 폴카 도트 / 게티 이미지)

낙하 모자

워드 프로세싱에서 드롭 고양이는 단락의 첫 글자를 확대합니다. HTML 및 CSS를 사용하여 웹 페이지에서이 효과를 재현 할 수 있습니다. "float"속성을 사용하여 단락의 나머지 텍스트에 상대적인 크기를 늘리려면 대문자와 글꼴 크기를 맞 춥니 다. 문자를 "span"태그에 넣으십시오.

예 :

E 이것은 float 속성을 사용한 드롭 캡 효과의 예입니다.

텍스트 롤링

HTML의 선택 윤곽 효과 (마진)는 텍스트를 다른 방식으로 이동시킵니다. 코드의 "direction"명령은 브라우저가 텍스트가 이동할 위치를 위, 아래, 왼쪽 또는 오른쪽으로 알려줍니다. "behavior"속성은 텍스트의 이동 방법을 설명합니다. "스크롤"속성을 사용하면 텍스트가 표시된 영역 이상으로 이동 한 다음 다시 나타납니다. "슬라이드"명령은 여백 끝에 텍스트를 멈추게하고 "대체"는 텍스트를 좌우로 이동시킵니다. "scrollamount"명령을 사용하여 속도를 결정하고 숫자가 클수록 스크롤 속도가 빠릅니다.

예 :

텍스트 롤링!