> 웹 프론트엔드 > CSS 튜토리얼 > 속성 확대/축소의 역할에 대한 자세한 설명: CSS 스타일의 1

속성 확대/축소의 역할에 대한 자세한 설명: CSS 스타일의 1

巴扎黑
풀어 주다: 2017-06-02 13:37:48
원래의
2303명이 탐색했습니다.

p >

CSS에서 Zoom:1의 역할
IE6, IE7 및 IE8 브라우저와 호환되며 종종 몇 가지 문제가 발생합니다. Zoom:1을 사용하여 문제를 해결할 수 있으며 다음과 같은 기능이 있습니다.
IE 브라우저의 haslayout을 실행하여 IE에서의 부동 및 여백 겹침과 같은 일부 문제를 해결합니다.
예를 들어, 이 웹사이트는 p를 사용하여 행 1개와 열 2개를 표시합니다. HTML 코드:

<div class="h_mainbox"> 
<h2>推荐文章</h2> 
<ul class="mainlist"> 
<li><a href="#" style="color:#0000FF" target="_blank">CSS库吧</a></li> 
<li><a href="#" style="color:#0000FF" target="_blank">原创< /a></li> 
</ul> 
</div>
로그인 후 복사

CSS 코드:

.h_mainbox { 
border:1px solid #dadada; padding:4px 15px; background:url(../mainbox_bg.gif) 0 1px repeat-x; margin-bottom:6px; overflow:hidden}
 .h_mainbox h2
 { font-size:12px; height:30px; line-height:30px; border-bottom:1px solid #ccc; color:#555;} .h_mainbox h2 span { float:right; font-weight:normal;}
 .h_mainbox ul { 
padding:6px 0px; background:#fff;}
 .mainlist { 
overflow:auto; zoom:1;}
 .h_mainbox li { 
width:268px; 
float:left; 
height:24px; 
overflow:hidden; 
background:url(../icon3.gif) 0 6px no-repeat; 
padding:0px 5px 0px 18px; 
line-height:200%;}
로그인 후 복사

빨간색을 추가하면 IE6에서 작동합니다. IE7 및 IE8 디스플레이 효과는 정상입니다.

IE6, IE7, IE8에서 정상적으로 효과를 표시하려면 빨간색을 추가하세요.
CSS에서 확대/축소의 역할
1. 페이지의 레이블이 닫혀 있는지 확인하세요
이것을 과소평가하지 마세요. 아마도 아직 해결하지 못한 CSS BUG 문제로 어려움을 겪고 있을 수도 있습니다. 이틀동안 해결했는데 여기까지만이네요. 결국 페이지 템플릿은 일반적으로 개발자가 중첩하므로 이러한 문제가 쉽게 발생할 수 있습니다.
빠른 팁: Dreamweaver를 사용하여 파일을 열어 확인할 수 있습니다. 일반적으로 닫힌 태그가 없으면 노란색 배경으로 강조 표시됩니다.

2. 스타일 제외 방법
일부 복잡한 페이지에서는 N개의 외부 링크 CSS 파일을 로드한 다음 CSS 파일을 하나씩 삭제하고 BUG에 의해 트리거된 특정 CSS 파일을 찾습니다. 잠금 범위를 좁힙니다.

방금 잠긴 문제가 있는 CSS 스타일 파일의 경우 특정 스타일 정의를 한 줄씩 삭제하고 특정 트리거 스타일 정의와 특정 트리거 스타일 속성까지 찾습니다.

3. 모듈 확인 방법
때때로 페이지의 HTML 요소에서 시작할 수도 있습니다. 페이지에서 다른 HTML 모듈을 삭제하고 문제를 유발하는 HTML 모듈을 찾으십시오.

4. float가 지워졌는지 확인하세요
실제로 float를 지우지 않아서 발생하는 CSS BUG 문제가 많습니다. 부동 소수점을 지우는 좋은 습관을 기르는 것이 필요합니다. 추가 HTML 태그 없이 부동 소수점을 지우는 방법을 사용하는 것이 좋습니다. 부동 소수점을 지우려면 Overflow:hidden;zoom:1과 같은 유사한 방법을 사용하지 마십시오. 이는 너무 제한적입니다. ).

5. IE에서 haslayout이 실행되는지 확인
IE에서 발생하는 많은 복잡한 CSS BUG는 IE의 고유한 haslayout과 밀접하게 관련되어 있습니다. haslayout에 대한 친숙함과 이해는 절반의 노력으로 복잡한 CSS 버그를 해결하는 데 도움이 됩니다. old9가 번역한 "레이아웃이 있는 경우"를 읽어보는 것이 좋습니다(위대한 GFW를 통과할 수 없는 경우 파란색에서 다시 게시글을 읽을 수 있습니다)
빠른 팁: haslayout이 트리거되면 IE 디버깅의 속성이 도구 IE 개발자 도구 모음은 haslayout 값이 -1임을 표시합니다.

6. 테두리 및 배경 디버깅 방법
이름에서 알 수 있듯이 디버깅할 요소에 눈에 띄는 테두리나 배경(보통 검은색 또는 빨간색)을 설정하는 것입니다. 이 방법은 CSS 버그 디버깅에 가장 일반적으로 사용되는 방법 중 하나이며 복잡한 버그에도 여전히 적용 가능합니다. 경제적이고 환경친화적입니다^^
마지막으로 강조하고 싶은 점은 좋은 작성 습관을 기르고, 추가 태그를 줄이고, 가능한 한 의미론적으로 노력하고, 표준을 준수하면 실제로 더 복잡한 CSS를 많이 절약할 수 있다는 것입니다. BUG는 실제로 우리 자신에게 문제를 일으키는 경우가 많습니다. 벌레를 멀리하고 당신의 삶이 점점 더 좋아지기를 바랍니다.

위 내용은 속성 확대/축소의 역할에 대한 자세한 설명: CSS 스타일의 1의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿