50가지 Dreamweaver 팁 질문

저자：Eve Cole 업데이트 시간：2009-05-31 21:26:41

Dreamweaver는 항상 많은 네티즌들이 선호하는 웹 디자인 도구였습니다. 강력한 동적 효과 제작 기능 외에도 편리하고 간결한 조작 인터페이스도 독특합니다. 아래에서는 최신 버전의 Dreamweaver4를 예로 들어 체계적으로 질문하겠습니다. 디자인 과정에서 자주 접하게 되는 몇 가지 문제와 기법을 소개하겠습니다.
참고: 편의상 아래에서는 모든 Dreamweaver를 DW 표현으로 축소하겠습니다.

1> DW에서 공백은 어떻게 입력하나요?

공간 진입 문제는 DW에서 흔한 문제가 된 것 같습니다. DW 사용을 소개하는 많은 책이나 기사에서 여러 번 본 적이 있을 것입니다.

DW에서 공백 입력에 대한 제한은 "반자" 텍스트 상태에 대한 것이므로 입력 방법을 전각 모드로 조정하면 피할 수 있습니다. 방법은 다음과 같습니다. 중국어 입력 방법을 엽니다(인공지능 ABC를 입력으로 사용). 예) Shift +Space를 눌러 전체 너비 상태로 전환하면 이제 문제가 없을 것입니다.

또한 다양한 "해결 방법" 방법을 통해 공백 입력 목적을 달성할 수도 있습니다. 예를 들어 일반적으로 사용되는 방법은 다음과 같습니다.

특정 텍스트 개체를 입력한 후 소스 코드에 공백을 나타내는 HTML 코드 " "를 직접 추가합니다. 길이를 조정한 다음 텍스트 색상을 조정합니다. 현재 배경색과 동일하지만 일부 브라우저에서는 후자가 문제를 표시할 수 있다는 점에 유의하세요. (하하, 그때 제가 사용하고 있던 것이 왕첸윤이 발견한 것이었습니다!)

2> 브라우저 주소창 앞에 맞춤식 작은 아이콘을 추가하는 방법은 무엇인가요?

NetEase 웹사이트의 홈페이지를 검색할 때 가끔 WWW.163.COM 앞에 "Easy"라는 단어가 적힌 작은 아이콘이 표시되는 것을 기억하십니까? 기본적으로 이 아이콘은 IE 브라우저의 지정된 그림입니다. 그림에 표시된 대로:

사실 이것은 정교한 기술이 아니며 웹사이트 디렉토리에 특정 파일을 추가하는 것뿐입니다.

이때 16*16픽셀 크기의 아이콘 파일을 미리 만들어 주어야 합니다. 파일 확장자는 ico이며 해당 디렉토리에 업로드됩니다. HTML 소스 파일 "<head></head>" 사이에 다음 코드를 추가합니다.

"SHORTCUT ICON"은 아이콘의 이름입니다. 물론, 사용자가 IE5 이상을 사용하여 탐색하는 경우에는 웹사이트의 루트 디렉토리에 이미지를 업로드하기만 하면 자동으로 인식됩니다!

3> 원래 잘 디자인된 웹 페이지가 브라우저 창을 최소화하면 왜 보기 흉하고 당황스러워지나요?

이는 모든 사람이 주목할 만한 문제입니다. 즉, 전체 화면 모드에서 웹 콘텐츠를 탐색할 때 전혀 문제가 없습니다. 창 최소화 명령을 사용하거나 창 크기를 수동으로 조정할 때 문제가 서서히 발생합니다. 웹 페이지의 콘텐츠는 현재 창을 표시 범위로 사용하고 순서대로 진행됩니다. 예를 들어 메모장의 "자동 줄 바꿈"과 "줄 바꿈 없음"의 차이점은 정확히 같습니다.

이 문제를 해결하려면 웹 페이지의 레이아웃부터 시작해야 합니다. 일반적인 상황에서 웹 콘텐츠의 위치 지정은 대부분 테이블을 통해 이루어집니다. 따라서 문제의 "결함"은 형태에 있습니다.

아래 테이블의 속성 패널 표시를 살펴보십시오.

테이블의 높이 및 너비 설정 옵션인 백분율과 픽셀에 대해 두 가지 유형이 제공되는 것을 볼 수 있습니다. 백분율을 사용하면 앞서 언급한 문제가 발생합니다. 픽셀 단위의 실제 크기로 수정하면 됩니다.

4> 웹 페이지가 표시될 때 상단에 프롬프트 메시지를 변경하는 방법은 무엇입니까?

웹페이지를 탐색할 때 상단에 표시되는 프롬프트 정보는 웹페이지의 주요 내용을 나타내는 경우가 많아 방문자가 웹페이지의 내용을 미리 이해할 수 있도록 도와줍니다. DW4 이전에는 이 작업을 함수에서 직접 제공하지 않았으며 소스 코드에 "Title" 속성을 적용하여 완료하는 경우가 많았습니다. DW4에 들어가는 것이 훨씬 간단합니다.

편집창 상단의 '제목' 입력란에 필요한 텍스트 정보를 직접 입력하시면 됩니다.

5> 사진에 특정 색상의 테두리를 어떻게 추가하나요?

테두리가 없는 사진의 경우 웹 페이지에 직접 삽입하면 표시 효과가 상당히 떨어집니다. Microsoft FP에서 사진에 만족스러운 테두리를 추가하는 것은 꽤 번거로운 작업이라는 점을 기억하십시오.

그러나 DW에서는 테두리 너비를 직접 설정할 수 있는 "Border" 속성이 있기 때문에 훨씬 쉽습니다. 그림과 같이

너비가 설정된 후 색상은 어떻습니까? 패널에는 색상 선택이 없습니다! 하하, 사실 여기에는 트릭이 있습니다. 마우스를 사용하여 그림 개체를 선택하지 말고 드래그하여 선택하세요. 텍스트 색상을 설정하는 것과 같은 방법으로 하면 됩니다.

6> 사진과 링크 텍스트에 대한 프롬프트 정보를 어떻게 추가하나요?

웹 페이지를 탐색할 때 이미지 개체나 링크 위에 마우스를 놓으면 마우스 오른쪽 하단에 프롬프트 메시지 상자가 나타나는 경우가 있습니다. 목표에 대해 몇 가지 의견을 말해보세요. 어떤 경우에는 그 역할이 매우 중요합니다.

먼저 이미지 프롬프트 정보를 추가하는 방법을 살펴보겠습니다. 이미지 개체를 선택하면 속성 패널에 "Alt" 입력 상자가 있습니다. 기본적으로 이 입력 상자는 비어 있습니다. 여기에 필요한 프롬프트 내용을 입력하기만 하면 됩니다.

그러면 링크 프롬프트 생성이 그렇게 간단하지 않습니다. 이 기능은 DW에서 직접 제공되지 않기 때문에 이를 구현하려면 HTML 코드를 추가해야 합니다.

<a href="" >에 "Title" 속성을 추가합니다. 제목=프롬프트 내용이면 충분합니다.

7> 다른 사람이 다운로드할 수 있는 자신만의 ZIP 파일이나 다른 유형의 파일을 만드는 방법은 무엇입니까?

많은 후배 웹 페이지 제작자의 눈에는 마우스 클릭만으로 다운로드를 완료하는 것이 매우 "신비한" 일로 보입니다. 브라우저에서 인식하지 못하는 DW의 형식 파일(HTM, HTML, ASP, PHP.PERL, SHTML 등 제외)을 링크 대상으로 사용하는 경우 기본 작업은 다음과 같습니다.

이때는 브라우저만 다운로드하면 됩니다

파일 이름을 쓴 다음 대상 파일에 대한 링크를 생성합니다.

8> 디렉토리에 있는 텍스트를 어떻게 확인할 수 있습니까? 웹 페이지는 브라우저 글꼴 크기 설정에 따라 변경되지 않나요?

우리 모두 알고 있듯이 IE 브라우저에는 기능 설정에 창 내용의 글꼴 크기를 자유롭게 설정할 수 있는 기능이 있습니다. 다양한 방문자의 습관에 따라 그들에게 표시되는 웹페이지가 때때로 다를 수 있습니다.

예를 들어 원래 디자인에 크기 2 글꼴을 사용했지만 사용자의 추가 브라우저 설정으로 인해 크기가 커졌을 수 있으며 이때 표시 효과에 문제가 있을 수 있습니다.

그런 다음 해결책은 웹 페이지 콘텐츠를 특정 적절한 크기로 질적으로 강제하는 것입니다. 즉, 그는 변경할 수 없습니다. 이 요구 사항은 CSS 스타일 시트를 통해 글꼴을 강제로 제어함으로써 달성할 수 있습니다.

9> 대상 링크를 새 창으로 열까요?

새 창에서 열기는 이름에서 알 수 있듯이 현재 창을 가리지 않고 다른 브라우저 창을 여는 것을 의미합니다. 연결 코드에 <a href="">"Target=_blank"를 직접 추가할 수 있습니다.

HTML이 품질이 좋지 않은 경우 DW 속성 패널에서도 이 설정이 제공됩니다. 링크 입력 상자에 WWW URL을 입력하면 뒤에 있는 대상 드롭다운 상자도 동시에 활성화됩니다. 그림과

같이 상단의 "공백"을 선택하시면

됩니다. 10>

많은 상업용 웹사이트에서 흔히 볼 수 있는

웹페이지 로딩시 광고창이 뜨는 것을 방지하는 방법입니다.

Behavior Behavior를 통해 DW에서 쉽게 구현할 수 있습니다.

로드 중이므로 전체 웹 페이지 콘텐츠를 이벤트 개체로 처리할 수 있습니다. DW 편집 창 좌측 하단의 "<body>" 태그를 클릭하면 웹 콘텐츠가 모두 선택되어 있는 것을 확인할 수 있습니다.

그림과 같이 "Quick Launchpad"에서 "Behavior" 버튼을 클릭하여 동작 패널로 들어갑니다.

"Open Browse Window" 항목을 선택합니다. 이때 크기, 보존 등 창 스타일을 사용자 정의할 수도 있습니다. 도구 버튼 등. 또 다른 점은 해당 이벤트가 "Onload"라는 점을 잊지 마세요.

11> 빠른 실행 패드에 "Timelines"가 없습니다. 어떻게 해야 합니까?

DW가 버전 4로 업그레이드된 후 빠른 실행 패드에 Assets 등 여러 가지 새로운 프로젝트가 추가되었습니다. 이때 원래 상단에 있던 타임린스 버튼이 눌려져 있었습니다.

물론 지금 바로 사용하고 싶다면 "Windows"-"타임라인" 메뉴를 통해 찾을 수 있습니다. 하지만 결국 런치패드에 넣는 것만큼 편리하지는 않습니다. 이때는 설정을 통해 추가하면 됩니다!

"Edit"-"Preference" 창에 들어가서 그림과 같이 왼쪽 프로젝트 목록에서 "panels"를 선택한 다음

위의 "+" 버튼을 클릭하고 드롭다운 목록에서 "Timelines"를 선택합니다. 이때 타임라인은 현재 "런처에 표시" 목록 콘텐츠에 자동으로 추가되었습니다. 변경된 "Launcher" 패널이 그림에 표시됩니다.

동시에 작업 효율성을 높이기 위해 필요에 따라 패널에 나타나는 버튼 옵션을 자유롭게 선택할 수도 있습니다.

12> 5분마다 자동으로 새로 고쳐질 수 있도록 웹 페이지를 만듭니다. 어떻게 해야 할까요?

인터넷을 탐색하다 보면 우리는 종종 몇몇 웹페이지를 접하게 됩니다. 일정 시간이 지나도 응답이 없으면 자동으로 새로 고쳐집니다. 방문자에게 알림을 제공하는 목적 외에도 새 새로 고침 주소가 현재 URL이 아닌 경우 자동 점프 기능이 구현됩니다.

반복 새로 고침인지 자동 점프인지. 웹 디자인에서는 모두 매우 실용적인 작업입니다. 아래에서는 만드는 방법을 소개합니다.

DW "개체" 패널의 "머리" 섹션을 선택합니다. 기본적으로 공통의 "콘텐츠"가 표시됩니다.

그림

과 같이

위의 "Refresh" 버튼을 클릭하면 다음과 같은 팝업창이 뜹니다.

"Delay" 입력란에 새로고침 지연 시간(단위: 초)을 입력하고, "Action"이 대상 URL입니다. 새로 고침을 위해 지정되었습니다. 현재 페이지를 새로 고치는 중이므로 "이 문서 새로 고침" 메뉴 옵션을 선택하세요.

13> 웹페이지의 키워드(Keyname)는 어떻게 정의하나요?

사용자가 적합한 콘텐츠가 포함된 웹페이지를 검색하기 위해 검색 엔진을 사용할 때 키워드는 무시할 수 없는 역할을 합니다. 대부분의 검색 서버는 정기적으로 네트워크에 새로운 웹 페이지가 생성되는지 여부를 자동으로 감지하고 이를 키워드별로 기록하여 사용자 쿼리를 용이하게 합니다.

물론 귀하의 웹 페이지가 검색 엔진의 검색어 반환 목록에 나타나기를 원합니다. 이때 키워드 정의가 특히 중요합니다.

또한 "Head" 패널에서

그림과 같이 "Keywords" 버튼을 클릭하면 다음과 같은 정의 창이 나타납니다.

정의해야 할 키워드를 하나씩 입력하시면 됩니다. ";" 기호가 있으며 개수에는 제한이 없습니다.

14> 편집창에서 불필요한 라벨을 숨기는 방법은 무엇인가요?

사용자가 웹 페이지에 보이지 않는 요소를 너무 많이 삽입하면 해당 레이블 행이 편집 창 상단에 표시되어 사용자가 언제든지 쉽게 찾을 수 있습니다. 이러한 태그 자체는 브라우저의 표시 효과에 영향을 미치지 않지만 태그가 너무 많으면 웹 페이지의 내용이 잘못 정렬되는 경우가 많아 웹 페이지의 시각적 조정을 어느 정도 방해하게 됩니다. 이런 것들을 어떻게 제거할 수 있나요?

그림과 같이 "Preperence" 패널에 들어가서 목록에서 "Invisibel Elements"를 선택합니다.

스크립트 등 표시하고 싶지 않은 항목 앞에 있는 "체크 표시"를 체크하면 됩니다.

15> 정렬 "프레임" 컨텐츠를 지원하지 않는 브라우저가 표시됩니까?

현재 브라우저의 종류가 많다는 것을 알고 있기 때문에 웹페이지를 디자인할 때 가장 먼저 고려하는 것이 "이것이 다른 브라우저에서도 잘 표시될까?" 하는 경우가 많습니다. 프레임은 예시입니다!

하지만 이를 방지하려면 매우 간단합니다. 소스 코드에 다음 내용을 추가하기만 하면 됩니다.

< BODY><noframes> --- 이 웹페이지에는 프레임 구조가 포함되어 있습니다. 정상적으로 표시되지 않는 경우 새 브라우저 버전을 다운로드하거나 일반 브라우저로 변경하세요. --- < /noframes></ BODY>

16> 방지 방법 다른 사람들이 귀하의 웹 페이지를 프레임에 넣지 않습니까?

나쁜 의도를 가진 일부 사람들은 다른 사람이 공들여 만든 웹 페이지를 자신만의 프레임에 하위 페이지 형태로 넣는 등 다른 사람의 작업 결과물을 훔치는 경우가 많습니다.

그렇다면 웹 콘텐츠가 "도난"되는 것을 방지하는 방법은 무엇입니까?

웹페이지 소스 코드의 <head></head> 사이에 다음 코드 내용만 추가하면 됩니다:

17> 댓글은 어떻게 추가하나요?

주석 내용은 이름에서 알 수 있듯이 설명 내용으로만 표시되므로 탐색 시 웹 페이지에 표시되지 않습니다. 그 기능은 필요에 따라 특정 중요하거나 복잡한 코드를 표시하여 더 쉽고 빠르게 찾을 수 있도록 하는 것입니다.

"객체" 패널의 "Invisibel" 섹션(즉, 보이지 않는 요소)을 입력하고 "설명" 삽입 버튼을 선택합니다. 창은 다음과 같습니다.

"설명"에 필요한 정보를 입력합니다. 이때 소스 코드로 돌아가면 이러한 작업이 다음 형식의 코드 조각 외에는 아무것도 추가하지 않는 것을 볼 수 있습니다.

<! --입력해야 하는 주석 내용입니다-->

18> 가로줄, 왜 색상 설정이 안되나요?

DW에서 "삽입" - "수평규칙" 메뉴를 통해 수평선을 삽입할 때, 초기 NC에서는 < 태그를 지원하지 않기 때문에 속성 패널에서 수평선의 색상에 대한 설정이 없다는 것을 알 수 있습니다. hr> (가로줄에 대한 HTML 코드) ) COLOR 속성이므로 DW에는 이에 대한 설정이 없습니다. 그림과

같이

필요한 경우 소스 파일을 직접 입력하여 변경할 수만 있습니다.

19> 현재 창을 닫을 수 있는 기능은 어떻게 설정하나요?

여기에서는 먼저 "창 닫기" 표시에 사용된 텍스트를 입력하고 마우스로 드래그하여 선택한 다음 "링크" 입력 상자에 "/"를 입력하고 동시에 소스 코드 창으로 잘라내어 다음을 입력합니다. 이벤트 -onclick= 링크 코드 "javascript:window.close(); return false;"에서.

전체 코드는 다음과 같습니다. < a href="/" onclick="javascript:window.close(); return false;">창 닫기</a>

물론 "창 닫기" 텍스트를 다른 개체로 바꿀 수도 있습니다. , 사진, 버튼 등!

20> 예정된 시간에 자동으로 닫히는 창문은 어떻습니까?

위에서 창을 닫는 기능을 언급했는데, 이제 자동 닫기는 어떻게 구현되나요?

소스 코드 <body> 뒤에 다음 코드를 추가합니다:

< script LANGUAGE="javascript">  </script>

Timeout 설정은 지연 시간을 설정하는 함수로, 10000은 10초를 의미합니다.

21> 브라우저에서 마우스의 "모양"을 변경하는 방법은 무엇입니까?

일반적으로 마우스는 브라우저에서 "화살표" 스타일로 표시되는데, 원하는 다른 스타일로 변경할 수 있나요?

마우스 모양 변경은 DW에서 "CSS 스타일 시트"를 통해 구현됩니다.

메뉴 "텍스트" - "CSS 스타일" - "스타일 시트 편집", 스타일 시트 편집 창이 나타납니다. 다음과 같이 빠른 실행 패드에서 CSS 스타일 버튼을 클릭하여 찾을 수도 있습니다.

" 새로 만들기를 클릭합니다

" 버튼을 눌러 기본 "사용자 정의 스타일 만들기"를 선택하고 동시에 아래 정의 "이 문서에만"에서 현재 웹 문서에만 스타일을 적용하도록 합니다.

"스타일 정의" 창 왼쪽의 목록 항목에서 "확장"을 선택합니다. 오른쪽의 해당 설정은

"커서"(마우스)에 표시된 것과 같습니다. 확인 후 다시 돌아가서 선택합니다. F12를 눌러 도구에서 효과를 관찰하세요. 만족스럽지 않으면 스타일을 수정할 수도 있습니다.

22>링크 텍스트 아래의 밑줄을 어떻게 제거하나요?

링크 생성이 완료되면 링크 텍스트 내용에 밑줄이 자동으로 추가되어 내용에 하이퍼링크가 포함되어 있음을 나타냅니다. 웹페이지에 링크가 많으면 다소 복잡해 보이지만 실제로는 쉽게 제거할 수 있습니다.

또한 "스타일 시트 편집" 창에 들어가서 "새로 만들기"를 클릭하여 아래와 같이 새로운 스타일을 설정합니다

. 유형(유형)에서 "HTML 태그 재정의"를 선택하고 동시에 "재정의"를 선택해야 합니다. 특정 태그 태그의 하이퍼링크를 나타내는 HTML 태그"를 선택하고 확인을 클릭합니다.

이 스타일을 편집하고 왼쪽 목록에서 "유형"을 선택하고

다음과 같이 "장식"에서 "없음" 확인란을 선택합니다. 이때 모든 웹 페이지의 링크 텍스트 밑줄이 제거됩니다.

23> 링크 텍스트 위에 마우스를 올리면 변색, 변형 및 기타 효과가 발생하도록 하려면 어떻게 해야 합니까?

웹 사이트를 방문할 때 우리가 접하는 가장 일반적인 효과 중 하나는 "마우스 오버 응답"입니다. 소위 "마우스 오버 응답"은 색상 변경 및 효과 수정(밑줄, 중앙 스트로크) 및 기타 옵션.

이 효과는 대상 콘텐츠를 강조하는 데 매우 좋은 역할을 하기 때문에 개인 웹사이트와 일부 대형 상업용 웹사이트(예: Sina, Sohu, NetEase 등)에 모두 적용됩니다.

이전 질문에서는 링크 밑줄을 제거하는 방법을 이미 알고 계셨으므로 여기서는 자세히 설명하지 않겠습니다. 다음 질문은 마우스 응답 이벤트 프로세스를 추가하는 방법에 대한 것입니다.

또한 "스타일 시트 편집" 창에 들어가서 "새로 만들기"를 클릭하여 새 스타일을 설정합니다. 차이점은 이제 유형 유형의 마지막 항목인 "CSS 선택기 사용"을 선택하고 "선택기"에서 "a:hover"를 선택한다는 것입니다. " 메뉴를 다음과 같이

OK, 편집 스타일 창으로 들어가서 "Type" 항목의 텍스트 색상을 "red"로 설정합니다. 물론 마우스를 올렸을 때 밑줄 효과를 추가할 수도 있습니다.

24>웹페이지의 배경 이미지가 콘텐츠와 함께 스크롤되는 것을 방지하는 방법은 무엇입니까?

배경 이미지는 많은 웹 디자이너가 자주 추가하는 것입니다. 웹 페이지의 콘텐츠가 한 화면을 초과하면 스크롤 막대를 당길 때 배경 이미지가 콘텐츠와 함께 상대적으로 스크롤됩니다. 따라서 배경이 잠기고 스크롤되지 않을 수 있습니다. 을 따라? 물론 "스타일 시트 편집" 창에 들어가서 "새로 만들기"를 클릭하여 새 스타일을 설정하고 TYPE에서 "HTML 태그 재정의"를 선택한 다음 태그 메뉴에서 "본문"을 선택하고 목록에서 "배경"을 선택해도 됩니다. 왼쪽에. 다음과 같이

"첨부 파일"을 "고정"으로 설정합니다

여기서 스크롤은 기본 스크롤 표시를 나타냅니다.

25> 배경음악을 꼭 알아야 하는데 어떻게 추가하나요?

Microsoft의 웹 도구인 Frontpage에는 배경 음악 설정 기능이 있지만 DW는 당연히 이 기능을 제공하지 않으므로 사용하려면 소스 코드에 수동으로 추가하기만 하면 됩니다.

사용하기 전에 배경 음악을 사용할 때 웹 페이지 파일의 크기에 주의를 기울여야 하며, 한 가지도 놓치지 말아야 한다는 점을 모든 분들께 상기시켜 드리고 싶습니다.

코드는 다음과 같습니다.

여기서 src는 음악 파일의 위치를 지정하고 autostart는 음악 파일이 업로드된 후의 작업입니다. true는 자동으로 재생을 시작한다는 의미이고, false는 재생하지 않음을 의미합니다(기본값).

26> 수평선을 사용하여 너비가 1인 얇은 선을 만드는 방법은 무엇입니까?

구현 방법을 보려면 여기를 클릭하십시오(편집자가 추가함)

27> 변경된 날짜를 웹 페이지에 자동으로 추가하는 방법은 무엇입니까?

소스 파일 <body></body> 사이에 다음 코드를 추가하면 됩니다.

< script Language="javascript"><!--
document.write(“마지막 업데이트:”+document.lastModified);

-->

브라우저의

< /script> 표시 스타일은

"최종 업데이트 날짜: 2001/8/19"입니다.

28> 팝업 POPUP 정보를 어떻게 제어하나요?

때로는 링크를 클릭하면 팝업 메시지와 같이 강조된 설명이 포함된 프롬프트 정보가 표시될 수 있습니다. 예를 들어 링크가 대상 콘텐츠 페이지 제작을 완료하지 못한 경우 POPUP 정보를 활용하여 설명할 수 있습니다.

웹 페이지의 적절한 위치에 링크 텍스트를 입력하고 선택한 후 속성 패널에서 링크를 생성합니다. 선택한 상태에서 빠른 실행 패드의 "동작" 버튼을 클릭합니다. 예를 들어

왼쪽 상단의 "+" 기호를 클릭하고 목록에서 "팝펀 메시지"를 선택한 다음 프롬프트에 표시되어야 하는 정보를 입력합니다. 후속 창에서는 그림과 같이

이 액션의 마우스 이벤트(Events)를 클릭(onclick)으로 설정합니다. 브라우저에서 미리보기 효과는 다음과 같습니다.

29> 브라우저 상태바의 URL 주소 정보를 숨기는 방법은 무엇인가요?

웹 브라우징 시 링크 위에 마우스를 올려놓으면 아래 상태 표시줄에 링크 대상 주소가 자동으로 표시됩니다. 보안 문제를 고려하여 가끔 "0"으로 재설정, 즉 공백으로 설정해야 할 때가 있습니다.

이제 이를 달성하려면 다음과 같이 링크 코드에서 몇 가지 트릭을 수행하면 됩니다.

< a href=" http://www.pconline.com.cn/pcedu ";;;; onmouseOver="window.status =' none';return true">Pacific Online Academy</a>

30>상태 표시줄의 프롬프트 텍스트를 어떻게 변경하나요?

기본적으로 웹페이지가 로드되면 웹페이지의 주소 및 기타 정보가 상태 표시줄에 표시됩니다. 더 매력적으로 만들고 싶나요?

DW "동작" 동작 패널에서 "+" 기호를 클릭하여 "텍스트 세트 설정" 아래의 "상태 표시줄 텍스트" 옵션을 선택하고 그림에 표시된 대로

"이 사이트에 오신 것을 환영합니다"와 같은 내용을 " 상태 표시줄' 창의 텍스트를 설정합니다. 웹사이트 - 네트워크 관리 메시지' 및 기타 메시지 정보를 설정합니다.

31> 이메일에 대한 양식 처리 방법을 설정하는 방법은 무엇입니까?

양식은 웹 페이지의 대화형 기능에 있어서 없어서는 안 될 요소입니다. 양식의 기능은 정보의 상호작용에 기인하므로 양식 처리에는 종종 높은 수준의 기술이 사용됩니다. 수준의 네트워크 프로그래밍 언어입니다. 나는 프로그래밍을 할 수 없다! 사실은 중요하지 않습니다. 일부 간단한 양식 콘텐츠 처리는 이메일로도 수행할 수 있습니다.

먼저 다음 코드를 보세요.

위는 METHOD가 메소드를 결정하는 일반적인 형태의 HTML 소스코드입니다. , POST 및 GET의 두 가지 유형이 있습니다. ACTION은 위에서 언급한 핸들러이며 일반적으로 ASP/PHP/CGI를 통해 구현될 수 있습니다.

그렇다면 이메일을 사용하여 어떻게 해야 할까요? action=mailto:[email protected]이므로 제출 버튼을 클릭하면 다음과 같은 프롬프트 창이 나타납니다.

"확인"을 클릭하면 양식 내용이 지정된 메일함으로 전송됩니다.

32> 표준화된 이메일 링크는 어떻게 생성하나요?

소위 "이메일 링크"는 클릭하면 브라우저가 자동으로 기본 메일 클라이언트 프로그램을 호출하여 이메일을 보내는 것을 의미합니다.

"PROBLEM MAIL ME"라는 단어를 입력하고 마우스를 끌어 선택한 후 속성 패널로 전환하고 링크 입력 상자에 다음 명령을 입력합니다.

Mailto: [email protected] ? 제목=네티즌이 보낸 편지&bc=다른 이메일 주소&bcc=다른 이메일 주소. 그림

과 같이

Mailto는 이메일 링크의 프로토콜, Subject는 이메일 제목, bc는 동시에 복사할 이메일 주소, bcc는 블라인드 카피를 나타냅니다.

33> "빈 링크"를 어떻게 생성하나요?

빈 링크는 링크 개체가 없는 링크입니다. 빈 링크에서는 대상 URL이 "#"으로 표시됩니다. 즉, 링크를 만들 때 속성 패널의 LINK 입력란에 # 표시만 입력하면 빈 링크가 됩니다.

빈 링크가 나타나는 데는 일부 페이지가 정기적으로 완료되지 않는 등 여러 요인이 관련되어 있으며, 페이지 표시의 일관성을 유지하기 위해(링크 스타일이 일반 텍스트 스타일과 다름) 이를 사용할 수 있습니다.

34> 빈 링크를 클릭하면 페이지가 페이지 상단으로 재설정되는 경우가 많습니다. 어떻게 처리해야 하나요?

브라우저에서 빈 링크를 클릭하면 자동으로 현재 페이지가 첫 번째 페이지로 재설정되어 사용자의 일반적인 읽기 콘텐츠에 영향을 미치게 됩니다. 물론 변경되지 않기를 바랍니다.

이때 원래의 "#" 표시를 "javascript:void(null)" 코드로 대체하면 문제가 해결되었습니다.

35> 페이지 내에서 자유롭게 이동할 수 있는 링크를 사용자 정의하는 방법은 무엇입니까?

온라인에서 무료 전자 잡지를 자주 구독하는 경우 이러한 종류의 "탭 링크"에 익숙해야 합니다. 디렉토리와 같은 목록을 통해 페이지의 어느 부분으로든 쉽게 이동할 수 있습니다. "매우 긴 콘텐츠" 웹페이지용으로 설계되었습니다.

먼저 링크가 가리키는 위치, 즉 화면이 이동한 후 링크가 머무를 위치를 결정합니다. "Object" 패널의 "Invisibles" 섹션에 들어가서 대상 텍스트를 선택한 후 "Insert Named Anchor" 버튼을 클릭하면 창이 다음과 같습니다.

"앵커 이름"에 태그 이름을 입력하고 확인을 클릭하면 일반 텍스트 내용과 구별하기 위해 텍스트 아래에 빨간색 점선이 자동으로 나타납니다.

그런 다음 링크를 생성하고 속성 패널의 링크 입력 상자에 "#nchor 이름(지금의 이름)"을 입력하면 됩니다. 물론, 다른 페이지의 특정 위치를 가리키고 싶다면 이 작은 꼬리를 거기에 넣을 수도 있습니다.

36> 한 사진에 동시에 여러 개의 링크를 생성할 경우 어떻게 해야 하나요?

이 문제는 우리가 일반적으로 "Image HOT"이라고 부르는 문제입니다. 물론 DW에는 "Image Hot Area"라는 또 다른 이름이 있습니다.

그림을 선택하면 속성 패널의 왼쪽 하단에 "지도" 도구 모음이 있습니다. 오른쪽에는

그림에서 사각형 도구를 예로 사용했습니다. , 마우스가 사진 위에 그대로 표시됩니다. 이는 마우스를 왼쪽 및 오른쪽으로 드래그할 수 있음을 의미합니다. 완료 후

여러 핫스팟 영역의 링크 생성을 완료할 수 있습니다. 영역은 겹칠 수 없습니다.

37> 마우스 이벤트에 반응할 수 있는 플립 이미지를 어떻게 생성하나요?

많은 웹 페이지에서 우리는 마우스를 그 위로 가져가면 다른 것으로 바뀔 수 있는 일부 열 제목을 자주 볼 수 있습니다. 사실, 이들 중 다수는 소위 "플립 사진(flip picture)" 효과라고 불리는 두 개의 서로 다른 사진을 사용하여 달성됩니다.

물론 뒤집을 때 시각적 불편함이 없도록 먼저 정확히 같은 크기의 두 장의 사진을 준비해야 합니다. "개체" 패널에서 "롤오버 이미지"를 클릭하여

"롤오버 이미지 설정" 창을 띄우고, 다음과 같이

각각 "찾아보기" 버튼을 클릭하여 "원본 이미지" 및 "롤오버 이미지"의 주소를 결정합니다. 아래의 "롤오버 이미지 사전 로드" 확인란을 선택해야 합니다. 그렇지 않으면 마우스 슬라이드 시 특정 다운로드 지연이 발생합니다. 끝났습니다.

38> 어떻게 하면 하늘을 나는 그림을 만들 수 있나요?

많은 대형 상업 웹사이트의 홈페이지에는 수많은 광고 사진이 떠다니는 것을 종종 볼 수 있습니다. 클릭하면 지정된 주소로 연결될 수 있으며 이는 타임라인을 통해 이루어집니다.

먼저 대상 사진을 웹 페이지에 삽입하고 동시에 선택한 다음 빠른 실행 패드에서 "Timelins" 버튼을 클릭하여 그림과 같이 "Timeline" 창으로 들어갑니다.

1프레임 위치를 마우스 오른쪽 버튼으로 클릭합니다

타임라인을 선택하고 "개체 추가"를 선택하면 타임라인에 파란색 막대(기본값 1-15프레임)가 나타납니다. 15프레임에서 카메라를 중지하고 페이지의 그림을 이동의 끝 위치로 이동합니다.

이제 간단한 모션 애니메이션이 완성되었으므로 중간에 키프레임을 추가하여 경로의 곡률을 조정할 수 있습니다. 효과를 미리 보려면 위의 오른쪽 화살표 버튼을 클릭하세요.

39> 페이지에 "정적으로 정지된" 이미지를 만드는 방법은 무엇입니까?

소위 "정지 정지"란 그림이 항상 웹 페이지의 특정 위치에 머물려고 하므로 마치 정지된 것처럼 시각적으로 페이지와 함께 "걷는" 것처럼 느껴지는 것을 의미합니다.

이 효과의 구현은 일반적으로 일정 수준의 프로그래밍 능력이 필요한 자바스크립트를 통해 이루어집니다. 다행히 DW는 이 효과를 생성하기 위한 고정 플러그인을 제공하므로 훨씬 간단합니다.

먼저 stav 플러그인 /u/info_img/2009-05/31/stav.zip을 다운로드하고 내부에 있는 두 파일(이미지 파일 Cross Browser Static Division.gif 및 웹 페이지 파일 Cross Browser 포함)의 압축을 풀어야 합니다. Static Division.htm)은 DW 설치 디렉터리 ConfigurationObjectsCommon에 복사됩니다.

DW를 다시 시작하면 하단에 SI 항목이 있는 것을 볼 수 있습니다. 이를 선택하고 팝업 창에서 플로팅 레이어에서 상단 및 왼쪽까지의 거리를 설정한 다음 지정된 항목만 삽입합니다. 내용(사진은 여기).

40> 텍스트와 이미지 콘텐츠를 어떻게 공존시킬 수 있나요?

우리 모두는 DW에서 그림 개체가 한 줄을 차지하는 경우가 많기 때문에 텍스트 내용은 그림 주위에 평행한 줄에만 배치할 수 있다는 것을 알고 있습니다.

그림을 선택하면 속성 패널의 오른쪽 상단에 "정렬" 속성 메뉴가 나타납니다.

이때 그림과 같이 "왼쪽"을 선택하면 텍스트가 고르게 정렬된 것을 확인할 수 있습니다. 그림의 오른쪽.

41> 여러 개의 창을 연결하는 방법은 무엇

입니까? 패널 디자인은 항상 DW4 버전에서 사용되는 패널이 상당히 많습니다. 그렇다면 어떻게 하면 더 효율적으로 사용할 수 있을까요?

"창 연결"은 누구나 편리하게 맞춤화할 수 있는 기술적 기능입니다. 간단히 말하면 필요에 따라 두 개 이상의 패널을 하나의 창에 넣을 수 있다는 의미입니다.

한 패널의 탭 바를 클릭하여 두 패널로 드래그하면 검은색 테두리가 보일 때 마우스를 놓으면 두 패널이 하나로 병합됩니다.

42> 사용 방법

웹페이지 뭔가를 숨기시겠어요?

웹 디자인에서는 트래픽 통계 시스템, 사용자 접속 분석 시스템 등 표시할 필요가 없는 일부 콘텐츠를 삽입해야 하는 경우가 있습니다. 이때 이를 어떻게 숨길 것인지 고려해야 합니다. 의 존재는 다른 웹 페이지 요소의 레이아웃에 영향을 미치지 않습니다.

그림과 같이 "개체" 패널에서 "레이어" 버튼을 클릭하고 마우스를 드래그하여 새 레이어를 만든 다음 숨겨야 하는 모든 내용을 여기에 넣습니다.

왼쪽 상단에 있는 작은 상자를 클릭합니다

레이어를 선택한 다음 속성 패널로 전환하고 그림과 같이 Vis 값을 "Hidden"으로 설정합니다.

와우! 정말 컨텐츠가 다 없어졌어요

43> 간단한 드롭다운 메뉴는 어떻게 만드나요?

드롭다운 메뉴는 웹페이지 공간을 크게 절약할 수 있기 때문에 친구 링크 목록, 협력 웹사이트 주소 등과 같이 여러 개체를 나열해야 하는 상황에서 주로 사용됩니다.

DW는 지루한 코드를 작성할 필요가 없도록 매우 간단한 제작 방식을 제공합니다!

그림과 같이 "Object" 패널의 "FORM" 섹션을 입력합니다.

"Drop-down Menu" 설정 창을 팝업하려면 "Insert Jump Menu" 버튼을 클릭합니다.

"Text"에 메뉴 항목 이름을 입력합니다

"; "URL로 이동"에 URL을 입력하거나 찾아보기 버튼을 사용하여 선택합니다. 상단 "+"표지판을 클릭하여 새 메뉴 항목을 입력하면 모든 항목이 "메뉴 항목"에 표시됩니다.

44> 너비가 1 인 얇은 선을 만드는 방법?

DW에서는 수평선이 "선"형태로 나타나지만 얇은 선을 만들 때 주로 너무 두껍고 필요한 진미가 없기 때문에 만족스럽게 수행하지 않습니다!

그런 다음 테이블의 적용을 통해 유연한 방법을 채택하여이를 구현할 수 있습니다.

웹 페이지에 1 행과 1 개의 열이있는 테이블을 삽입하고 테이블의 "셀 패딩"및 "셀 스페이스"를 "0"으로 설정하고 셀의 "bgcolor"를 빨간색으로 설정하십시오 다른 색상. 대신 "" "높이가 1로 설정됩니다.

가장 중요한 단계는 소스 코드를 확인하고 ""<td> </td>를 제거하는 것입니다.

45> 테두리가 1 인 사각형을 만드는 방법?

분명히, 우리는 여전히 테이블 설정을 완료해야합니다.

어쩌면 당신은 말할 것입니다. 이것은 간단하지 않습니다! 1 행과 1 개의 열이있는 테이블을 작성한 다음 "테두리"값을 1로 설정하십시오. 실제로, 이런 식으로 만든 테이블은 1의 경계가있는 사각형이 아니라 훨씬 "두꺼운"입니다!

마찬가지로 먼저 1 행과 1 열의 테이블을 삽입하고 테이블의 "테두리"및 "셀 패딩"을 "0"으로 설정하고 "셀 스페이스"를 "1"로 설정하십시오. 테이블의 "bgcolor"를 빨간색으로 설정하고 (즉, 테두리의 색상) 셀의 "bgcolor"를 흰색으로 설정하십시오. 효과는 다음과 같습니다.

46> 다른 페이지를 반환하기 위해 다른 브라우저를 설정하는 방법은 무엇입니까?

다른 브라우저는 다양한 기술과 효과를 지원합니다. 따라서 우리가 디자인하는 웹 페이지는 모든 브라우저에서 올바르게 또는 최적으로 표시되지 않을 수 있습니다. 현재 브라우저를 결정하기위한 점프가 필요합니다.

사용자가 다른 유형이나 버전의 브라우저로 엽니다면 사용자의 정상적인 브라우징을 보장하기 위해 다른 페이지를 반환 할 수 있습니다.

빠른 발사대에서 "동작"버튼을 클릭하고 "+"부호를 클릭하고 드롭 다운 목록에서 "검색 확인"을 선택하십시오.

다른 유형에 따라 순서대로 설정할 수 있습니다.

47> 웹 페이지의 어느 곳에서나 드래그 할 수있는 객체를 만드는 방법은 무엇입니까?

웹 사이트를 방문 할 때는 종종 마우스로 드래그 할 수있는 많은 요소, 예를 들어, 광고 사진이 찾아보고자하는 콘텐츠를 차단하면 마우스로 선택하고 버릴 수 있습니다!

이 효과는 레이어의 "드래그 레이어"동작을 통해 달성됩니다 .

48> 웹 페이지에 외부 스타일 시트 (CSS)를 추가하는 방법은

내부 및 외부 스타일로 나뉩니다. 외부 CSS 참조는 <link> 태그를 통해 구현됩니다.

49> 웹 페이지의 기본 (기본 주소)을 설정하는 목적은 무엇입니까?

"객체"패널의 "헤드"섹션에는 "base"라는 버튼이 있으므로 웹 사이트의 기본 주소를 설정하는 데 사용됩니다.

우리 모두가 아시다시피, 우리가 DW에서 사용하는 링크 방법은 상대적으로, 즉 루트 주소가 변경되는 한, 이에 따라 자동으로 변경됩니다.

그러나 때로는 변경하지 않아도됩니다. 즉, 고정 된 주소를 사용하도록 강제로 "기본"버튼을 클릭하십시오. 그림과 같이 :

"Href"에 기본 주소의 URL을 입력하고 클릭하십시오. "OK"를 효과적으로 만들기 위해.

50> 웹 페이지에서 콘텐츠를 정확하게 찾는 방법은 무엇입니까?

이것은 예시적인 기술 질문이므로 50 가지 질문이 끝날 때까지 넣었습니다. 현재 DW 웹 페이지 컨텐츠 포지셔닝은 주로 테이블과 레이어를 통해 달성됩니다.

테이블은 주로 다른 내용의 레이아웃을 완료하기 위해 테이블을 완전히 "블러링 할 수 있습니다 (브라우징에서는 보이지 않습니다) 모든 브라우저는 보편적이며 기술 지원이 없습니다.

비교적 말하면, 레이어를 사용하는 것이 더 캐주얼합니다. 유일한 것은 레이어가 최신 버전의 브라우저에서만 지원되지만 현재 상황에서 판단하려면 장애물이 없어야한다는 것입니다!