비디오: 드림위버) 커피페이지에 배경과 폰트css 추가하기.. Dreamweaver) background image, add fonts 2025
Adobe Dreamweaver CS6에서 웹 페이지의 배경을 만드는 것은 재미 있고 대부분의 사람들이 상상할 수있는 것보다 더 많은 방법으로 추구 할 수 있습니다. 하나의 작은 이미지로 반복 패턴을 만들거나, 워터 마크를 만들거나, 큰 이미지를 사용하여 전체 배경을 채울 수 있습니다.
기본적으로 HTML 배경은 선택한 이미지가 화면을 채울 때까지 반복됩니다. CSS 속성과 함께 반복 동작을 제어하거나 제거 할 수 있으며 단일 배경 이미지에 대한 정확한 위치 지정을 설정할 수도 있습니다.
패턴으로 배경을 채울 경우 모서리가없는 패턴 이미지를 만들어야합니다.
배경 이미지의 기본 반복 된 타일링을 사용하려면 다음 단계를 따르십시오.
-
Photoshop에서 파일 → 새로 만들기를 선택하여 새 이미지를 만듭니다.
-
나타나는 새로 만들기 대화 상자에서 높이보다 훨씬 넓은 이미지를 만들고 RGB를 선택한 다음 72 dpi를 선택하고 확인을 클릭합니다.
예를 들어 폭 텍스트 필드에 1000을 입력하고 높이 텍스트 필드에 20을 입력하십시오.
-
블렌드를 생성하려면 전경색과 배경색을 선택하십시오. 그래디언트 도구를 사용하여 이미지 영역의 위쪽에서 아래쪽으로 Shift + 드래그하여 그래디언트 채우기를 만듭니다.
-
파일 → 웹 저장을 선택하고 이미지를 JPEG 파일로 사이트의 웹 콘텐츠 폴더에 저장 한 다음 이미지를 닫습니다.
-
Dreamweaver에서 [수정]> [페이지 속성]을 선택하거나 속성 관리자에서 [페이지 속성] 단추를 클릭하여 이미지를 웹 페이지의 배경 이미지로 배치합니다.
페이지 속성 버튼이 보이지 않으면 페이지를 클릭하십시오. 이미지와 같은 다른 요소를 선택하지 않도록하십시오.
페이지 속성 대화 상자가 나타납니다.
-
페이지 속성 대화 상자에서 배경 이미지의 오른쪽에있는 찾아보기 단추를 클릭하십시오. 창이 나타나면 저장된 배경 이미지의 위치로 이동 한 다음 확인을 클릭합니다.
-
페이지 속성 대화 상자로 돌아가서 확인을 클릭합니다.
이미지가 배경에 나타나며 반복적으로 페이지 전체에 걸쳐 멋진 배경 그라데이션을 만듭니다!
사용자 모니터의 크기와 해상도에 따라 배경 이미지가 반복적으로 표시 될 수 있습니다. 배경 이미지를 반복하면 창의적인 결과를 얻을 수 있습니다.
브라우저에서 미리보기 / 디버그 버튼을 클릭하고 기본 브라우저에서 페이지를 미리보기 전까지는 배경이 표시되지 않을 수 있습니다.
