많은 친구들이 사진 자르는 방법에 대해 문의해왔고, 이 문제는 크거나 작을 수 있기 때문에 한두 문장으로 명확하게 설명하는 것은 절대 불가능하므로, 여유가 있을 때 이 문제를 설명하기 위해 간단한 예를 들어보겠습니다. 오늘은 집에서 시간을 보내세요. 시작해 보겠습니다.
1단계: 아래와 같이 PhotoShop에서 디자인 초안을 엽니다.
도구판에서 슬라이스 도구를 선택하고, 먼저 굵은 컷을 만들어주세요! 팁: 넓은 영역의 컬러 블록을 별도로 하나의 조각으로 자르고, 수평선을 최대한 깔끔하게 유지하세요. (자세한 내용은 나중에 배우게 됩니다.) 이슈는 추후 제작 페이지에서) 소감) 컷 사진은 다음과 같습니다.
2단계: 출력하려면 PhotoShop에서 웹용 파일 저장...을 선택하세요. 여기에서 일부 매개변수 선택에 주의하세요.
빨간색 선으로 표시된 부분 1, 2, 3을 살펴보겠습니다. 1의 슬라이싱 도구를 선택한 다음, 2의 그림을 클릭하고 3의 표시된 곳에서 색상 값을 선택합니다. 색상은 단일이므로 가능한 한 작게 선택할 수 있습니다. 색상 값 비트는 무엇입니까? 답변: 이렇게 하면 파일 크기가 크게 줄어들고 동시에 설정 후 사진의 색상이 더 잘 유지됩니다. 여기의 파일에는 그림과 같이 htm 및 이미지 폴더가 포함되어 있습니다.
이제 페이지가 절반만 완성되었습니다. 다음으로 Dreamweaver에서 사이트를 만듭니다.
3단계: 사이트 정의:
이미지 왼쪽의 사이트 이름에 사이트 이름을 예시와 같이 입력하세요.
그런 다음 사이트가 구축된 후 아래 로컬 루트 폴더에서 방금 내보낸 사이트의 모든 폴더를 선택하면 사이트 맵에 표시됩니다.
(웹사이트를 구축하는 이유는 무엇입니까?) 웹사이트를 구축하면 웹사이트에 포함된 파일과 폴더를 질서정연하게 정리하는 동시에 사이트를 다른 곳으로 쉽게 이동할 수 있는 좋은 습관을 갖게 됩니다. . 파일 경로를 다시 작성하지 않고 장소를 지정하십시오! (물론 사이트를 구축하고 싶지 않다면 아무도 강요하지 않을 것입니다. 제 작업에서 그런 동료를 만났습니다. 그들은 페이지용 사이트를 구축하는 데 익숙하지 않습니다. 물론, 결과적으로 많은 어려움이 따르게 됩니다. )
step4: 페이지 테이블을 다시 생성합니다. (왜?) 일반적으로 포토샵에서 직접 내보낸 htm 파일은 실제 사용 중에 일부 조정이 필요하기 때문에 직접 사용할 수 없습니다. 동적 텍스트가 있는 장소와 같이 페이지에 추가해야 합니다. 입력 페이지에서 사진을 사용하지 않으면 사진을 제거해야 합니다. 원하지 않는 사진을 제거하고 직접 생성된 htm에 원하는 것을 추가하면 됩니다. , 페이지가 끔찍해지고 전체 페이지가 완전히 혼란스러울 수 있다는 것을 알게 될 것입니다!
좋아요, 먼저 내보낸 htm 파일을 분석해 보겠습니다.
이 페이지의 테이블에 따르면 새 페이지에 3개의 행과 1개의 열이 있는 테이블을 만듭니다.
그림에서 간격과 정렬 오류를 보고 싶지 않기 때문에 셀 패딩, 셀 간격 및 테두리 값을 0으로 설정하는 것이 매우 중요합니다. 그런 다음 첫 번째 행에 3개의 행과 2개의 열이 있는 테이블을 삽입합니다. 그림과 같이 왼쪽 A 3열 테이블을 병합합니다.
테이블을 삽입할 때 원본 htm 파일의 내용을 비교하고 왜 그렇게 하는지 생각해야 합니다.
다음으로 두 번째 행에 2행 2열의 테이블을 삽입하고, 위와 같이 왼쪽 그리드를 병합한 후, 오른쪽 그리드의 첫 번째 행에 그림과 같이 1행, 5열 테이블을 삽입합니다.
마지막으로 아래쪽 행에 행 3개와 열 2개로 구성된 테이블을 삽입하고 그림의 항목 1과 2를 병합합니다.
자, 이제 우리의 임무는 테이블에 그림과 내용을 추가하는 것입니다! (사실 이미 충분히 설명했습니다!)
또한 그림과 내용을 추가할 때 테이블이 단위 align과 valign의 두 가지 속성은 매우 중요합니다. 이를 사용하여 작업을 수행하는 데 도움을 주어야 합니다. 직접 연습해 보세요!