CSS 웹 페이지 레이아웃 팁

프런트 엔드 웹 페이지 레이아웃 팁:

(권장 동영상 튜토리얼: css 동영상 튜토리얼)

1 Mozilla에서는 ul 태그에 기본적으로 패딩 값이 있지만 IE에서는 여백에만 값이 있습니다. .

2. 동일한 클래스 선택기는 문서에 반복적으로 나타날 수 있지만 ID 선택기는 클래스와 ID를 동시에 사용하여 정의가 반복되면 ID 선택기가 수행됩니다. ID의 가중치가 CLASS보다 크기 때문에 정의가 유효합니다.

3. 호환성을 조정하는 어리석은 방법(IE 및 Mozilla):

초보자는 다음과 같은 상황에 직면할 수 있습니다. IE에서는 동일한 레이블 속성을 A로 설정하는 것이 일반적이지만 Mozilla에서는 A로 설정해야 합니다. .B가 되거나, 둘이 뒤집어졌을 때만 정상적으로 표시될 수 있습니다.

임시 해결 방법:

选择符{属性名:B !important;属性名:A}

4. 중첩된 태그 그룹에 약간의 간격이 필요한 경우 외부에 있는 태그의 패딩을 정의하는 대신 내부에 있는 태그의 여백 속성에 그대로 두는 것이 좋습니다. li 태그 앞의 아이콘에는 목록 스타일 이미지 대신 배경 이미지를 사용하세요.

6. IE는 상속관계와 부자관계를 구분하지 못합니다. 모두 상속관계입니다.

7. 태그에 선택기를 추가할 때 CSS의 선택기에 주석을 추가하는 것을 잊지 마세요. 나중에 CSS를 수정할 때 이 작업을 수행하는 이유를 알게 될 것입니다.

8. 라벨에 어두운 배경 이미지와 밝은 텍스트 효과를 설정하는 경우. 이때 라벨의 배경색을 더 어둡게 설정하는 것이 좋습니다.

9. 링크의 4가지 상태를 정의할 때 순서에 주의하세요.

Link Visited Hover Active

10. 내용과 관련 없는 사진은 배경을 사용하세요

11. 정의 색상은 #8899FF=#로 줄여서 사용할 수 있습니다. 89F

12. 어떤 측면에서는 테이블 다른 태그보다 성능이 훨씬 좋습니다. 컬럼 정렬이 필요한 곳에 사용하시기 바랍니다.

13.