CSS 표시 사용 시 주의사항 요약:none_Experience exchange

1. 스타일 파일 또는 페이지 파일 코드에서 요소를 숨기기 위해 직접 display:none을 사용하는 경우, 페이지를 로드한 후 js를 통해 스타일을 설정하여 요소를 표시하지 않으면 js 코드가 해당 요소를 올바르게 가져올 수 없습니다. offSetTop, offSetLeft 등과 같은 일부 속성은 0 값을 반환합니다. 이러한 값은 요소를 표시하기 위해 js에서 style.display를 설정한 후에만 올바르게 얻을 수 있습니다.

2. display:none을 사용하여 숨겨진 요소는 Baidu와 같은 검색 사이트에서 검색되지 않으며, 이는 웹사이트의 SEO에 영향을 미칠 수 있습니다. 경우에 따라 left:-100000px를 사용하여 동일한 효과를 얻을 수 있습니다. .

3. 스타일 파일이나 을 통해 요소의 display:none 스타일을 설정한 경우 js로 style.display=""를 설정하면 요소가 표시되지 않습니다. 블록이나 인라인 교체와 같은 것입니다. style="display:none"을 통해 요소에 직접 설정하면 이 문제가 발생하지 않습니다

4. 경우에 따라 style.display 대신 style.visibility를 사용할 수 있지만 해당 스타일에 유의해야 합니다. visible 요소를 숨기면 페이지에서 요소가 차지하는 공간이 유지되는 반면 style.display는 요소를 숨기고 페이지에서 차지하는 공간을 포기합니다.