12일차: 확인 및 일반적인 오류_기본 튜토리얼

며칠 동안 열심히 일한 후, 우리는 XHTML+CSS를 사용하여 웹사이트를 다시 디자인하는 방법을 배우기 위해 열심히 노력했습니다. 그렇다면 우리가 만드는 페이지가 실제로 웹 표준을 준수하는지 어떻게 알 수 있을까요? W3C 및 일부 자원 봉사 웹사이트는 페이지가 표준을 준수하는지 확인하고 오류 수정을 위한 도움말 정보를 제공하는 데 도움이 되는 온라인 검증 프로그램을 제공합니다. 이러한 검사는 매우 유용하며 페이지를 디버깅할 때 가장 먼저 수행하는 작업입니다.

1.XHTML 유효성 검사

• 검증 URL: http://validator.w3.org/
• 확인방법 : URL확인, 파일업로드 확인

확인에 성공하면 그림과 같이 "이 페이지는 유효한 XHTML 1.0 전환입니다!"라는 메시지가 표시됩니다.

확인에 실패하면 그림과 같이 추가 확인 옵션과 오류 메시지가 표시됩니다.

일반적으로 "소스 표시" 및 "자세한 출력"을 선택하면 오류 코드 줄과 오류 원인을 찾는 데 도움이 됩니다.

일반적인 XHTML 유효성 검사 오류 원인 비교표

• DOCTYPE을 찾을 수 없습니다! HTML 4.01 Transitional로 돌아가기--DOCTYPE이 정의되지 않았습니다.
• 문자 인코딩을 찾을 수 없습니다. UTF-8로 대체됩니다.--정의되지 않은 언어 인코딩입니다.
• "img"의 종료 태그가 생략되었지만 OMITTAG NO가 지정되었습니다.--이미지 태그는 "/"로 닫히지 않습니다.
• SHORTTAG YES가 지정되지 않는 한 속성 값 사양은 속성 값 리터럴이어야 합니다. 속성 값은 따옴표로 묶어야 합니다.
• 요소 "DIV" 정의되지 않음---DIV 태그는 대문자일 수 없으며 div를 소문자로 변경해야 합니다.
• 필수 속성 "alt"가 지정되지 않았습니다---이미지에 alt 속성을 추가해야 합니다.
• 필수 속성 "type"이 지정되지 않았습니다---JS 또는 CSS에서 호출한 태그에 유형 속성이 누락되었습니다.

가장 일반적인 오류 중 하나는 라벨의 대문자 사용입니다. 일반적으로 이러한 오류는 관련이 있습니다. 예를 들어 를 잊어버리면 다른

태그가 오류를 보고하므로 일반적으로 오류 하나가 해결되면 걱정하지 마세요. 다른 오류는 사라집니다. 페이지가 XHTML1.0 유효성 검사를 통과하면 해당 아이콘을 페이지에 배치할 수 있습니다. 코드는 다음과 같습니다.

w3.org/check/referer"> ;

2.CSS2 유효성 검사

• 검증 URL: http://jigsaw.w3.org/css-validator/
• 확인 방법: URL 확인, 파일 업로드 확인, 직접 코드 확인

검증에 성공하면 "축하합니다. 이 문서는 스타일시트 검증을 통과했습니다!"라는 메시지가 표시됩니다. 호호, 검증 정보는 중국어를 지원합니다. 그림과 같이:

인증에 실패하면 오류와 경고라는 두 가지 유형의 오류가 표시됩니다. 오류는 수정해야 함을 의미합니다. 그렇지 않으면 검증을 통과하지 못할 것입니다. 경고는 W3C에서 권장하지 않는 코드가 있으므로 수정을 권장한다는 의미입니다.

일반적인 CSS2 유효성 검사 오류 원인 비교표

• (오류) 잘못된 숫자: color909090은 색상 값이 아닙니다: 909090 ---16진수 색상 값은 "#" 기호, 즉 #909090과 함께 추가되어야 합니다.
• (오류) 잘못된 숫자: margin-topUnknown 차원: 6pixels ---픽셀은 단위 값이 아니며 올바른 작성 방법은 6px입니다.
• (오류) scrollbar-face-color 속성이 존재하지 않습니다: #eeeeee --- 스크롤 막대 색상 정의는 비표준 속성입니다.
• (오류) 값cursorhand가 존재하지 않습니다: hand는 비표준 속성 값이며,cursor:pointer로 수정되었습니다.
• (경고)Line: 0 Font-family: 마지막 선택으로 유형군을 지정하는 것이 좋습니다. W3C에서는 글꼴을 정의할 때 "sans-serif"와 같은 유형의 글꼴로 끝날 것을 권장합니다. , 웹 글꼴이 다른 운영 체제에서 표시될 수 있도록 합니다.
• (경고)행: 0 can't find the warning message for otherprofile --코드에 비표준 속성이나 값이 있어 확인 프로그램이 해당 경고 정보를 확인하고 제공할 수 없음을 나타냅니다.

마찬가지로 확인을 통과한 후 CSS 확인 통과 아이콘을 배치할 수 있으며 코드는 다음과 같습니다.

/css-validator /">