Dreamweaver에서 CSS3 전환 효과 만들기 및 편집

(선택 사항) 전환을 적용할 요소(단락, 머리글 등)를 선택합니다. 또는 전환을 생성한 후 나중에 요소에 적용하는 방법도 있습니다.

[창] > [CSS 전환]을 선택합니다.

를 클릭합니다.

[새 전환] 대화 상자의 옵션을 사용하여 전환 클래스를 생성합니다.

선택기의 이름을 입력합니다. 선택기는 태그, 규칙, ID 또는 복합 선택기와 같은 모든 CSS 선택기가 될 수 있습니다. 예를 들어 모든 <hr> 태그에 전환 효과를 추가하려면 hr을 입력합니다.

전환을 적용할 상태를 선택합니다. 예를 들어 포인터를 요소 위로 옮길 때 전환을 적용하려면 [커서 놓기] 옵션을 사용합니다.

전환할 모든 CSS 속성에 대해 동일한 [지속 기간], [지연] 및 [타이밍 기능] 을 지정하려면 이 옵션을 선택합니다.

전환할 각 CSS 속성에 대해 다른 [지속 기간], [지연] 및 [타이밍 기능]을 지정하려면 이 옵션을 선택합니다.

CSS 속성을 전환에 추가하려면 를 클릭합니다.

전환 효과의 지속 시간을 초 또는 밀리초 단위로 입력합니다.

전환 효과가 시작되기 전의 시간입니다(초 또는 밀리초 단위).

사용 가능한 옵션 중에서 전환 스타일을 선택합니다.

전환 효과의 끝 값입니다. 예를 들어 전환 효과가 끝날 때 글꼴 크기가 40px로 늘어나도록 하려면 글꼴 크기 속성에 40px를 지정합니다.

현재 문서에 스타일을 포함시키려면 [이 문서만]을 선택합니다.

CSS3 코드용 외부 스타일시트를 생성하려면 [새 스타일 시트 파일]을 선택합니다. 전환 생성을 클릭하면 새 CSS 파일을 저장할 위치를 묻는 메시지가 표시됩니다. 스타일시트가 생성되면 [전환을 생성할 위치를 선택하십시오] 메뉴에 추가됩니다.

[CSS 전환] 패널에서 편집할 전환 효과를 선택합니다.

을 클릭합니다.

[전환 편집] 대화 상자를 사용하여 이전에 입력한 전환 값을 변경합니다.

[편집] > [환경 설정]을 선택합니다.

[CSS 스타일]을 선택합니다.

[대표 속성 사용]에서 [전환]을 선택 취소합니다.