DW 버튼을 설정하는 방법은 무엇입니까? DW에 배너 버튼 인스턴스 추가

이번에는 DW에 배너버튼을 추가하는 방법과 DW에 배너버튼을 추가할 때 주의사항에 대해 알려드리겠습니다. 다음은 실제 사례로 살펴보겠습니다.

1. 사진과 같이 배너 소재를 준비하고 img 사진 라이브러리에 넣습니다.

2. Dreamweaver 소프트웨어를 열고 ctrl+n새 HTML 파일을 만들고 저장합니다.

3. 본문 내 콘텐츠 상자에 콘텐츠를 생성하고 클래스 이름을 설정

<p class="banner">
<img src="img/banner.jpg" >
<input type="button" value="左"  class="bt_left">
    <input type="button" value="右" class="bt_right">
</p>

큰 상자에 그림과 두 방향 키를 담고 마지막으로 좌우 위치를 좌우로 배치합니다

4. 헤더 아래에 style 태그를 추가하여 배너를 조정합니다. 너비 및 높이 속성 값을 설정합니다:

<style>
.banner{width:1200px;height:300px;margin:0 auto;overflow:hidden;}
.banner img{width:100%;}
</style>

5. 대형 프레임 배너를 상대 위치로 설정하고, 왼쪽 버튼을 절대 위치로 설정하고, 위치를 설정합니다

.bt_left{position:absolute;top:50%;left:20px; }

6. 오른쪽 버튼의 절대 위치를 설정하고 위치를 설정합니다

.bt_right{position:absolute;top: 50%;right:20px;}

이 사례를 읽어보셨을 거라 생각합니다. 방법을 익힌 후 PHP 중국어 웹사이트의 다른 관련 기사를 주목하여 더 흥미로운 내용을 확인하세요!

추천 자료:

20 프론트엔드 실제 프로젝트에서 CSS 코드 사용 주의사항

문자열을 가로채려면 순수 CSS3를 사용하세요

위 내용은 DW 버튼을 설정하는 방법은 무엇입니까? DW에 배너 버튼 인스턴스 추가의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!