일반적으로 지원됩니다. 브라우저가 호버를 지원하지 않으면 어떻게 되나요? 그러면 브라우저가 호버를 지원하지 않는 문제에 대한 해결책을 알려드리겠습니다.
먼저 csshover.htc를 다운로드해야 합니다
압축된 패키지 파일을 다운로드하고 압축을 풀면 CSS 도입 시 "csshover.htc" 경로에 오류가 발생하지 않도록 "csshover.htc" 파일이 생성됩니다. 스타일을 저장하려면 이 파일을 CSS 파일과 같은 폴더에 넣으세요. 여기서의 실험은 별도의 CSS 파일을 생성하지 않고, "index.html" 파일이 하나뿐이므로 "csshover.htc"와 "index.html"을 같은 폴더에 넣습니다.
같은 폴더
같은 폴더에 넣어주세요
바디 스타일 선택기에서 파일 소개
바디 스타일 선택기 "body {behavior:url("csshover.htc"); }"에 정의되어 있습니다. 스타일 코드의 시작 부분에 배치됩니다.
body selector 정의
body selector의 정의에 csshover.htc를 도입하세요
이 웹페이지의 CSS 스타일 정의는 div:hover, li:hover, p:hover, custom names와 같습니다. CSS 선택 이름(.abc :hover), img:hover 및 정의된 스타일은 모두 IE6에서 지원됩니다.
특별 주의:
성공하려면 다음 코드를 HTML에 직접 추가해야 합니다(csshover.htc 파일을 HTML 파일에 직접 도입).
<style> body{behavior:url("csshover.htc");} /* 使用时候注意路径正确 */ </style>
csshover.htc 경로에 주의하세요.
ie6에서는 호버 케이스를 지원합니다
각각 세 가지 실험 사례를 진행합니다.
실험 예 설명
첫 번째 예: img 태그에 hover(예: img:hover{...}) 스타일을 지정합니다. 마우스가 지나갈 때 이미지가 더 커지고 이미지 사이의 거리가 멀어집니다. border 및 padding이 나타납니다.
아니요. 두 가지 예: li 태그에 hover(예: li:hover{...}) 스타일을 할당하면 마우스가 지나갈 때 ul li 태그에 검은색 테두리가 나타납니다.
세 번째 예: 마우스가 통과할 때 이름을 지정하려는 CSS 스타일에 호버 스타일을 지정합니다(예: li:hover{...}). 즉, is.abc:hover{...}). 이 abc 개체의 DIV 상자에 있는 개체의 텍스트가 빨간색으로 변합니다.
세 가지 작은 실험 예제의 CSS 코드는 다음과 같습니다.
body { behavior:url("csshover.htc"); }/* css注释:别忘记csshover.htc,使用时候注意路径 */ img{width:165px; height:60px; background:#090;}/* 原本图片宽度和高度背景颜色 */ img:hover{width:200px; height:200px; padding:3px; border:2px solid #00F; cursor:pointer} /* hover鼠标经过赋予让图片变宽 高,设置padding和2px蓝色边框、css cursor为鼠标指针样式 */ li:hover{ border:1px solid #000}/* li列表标签鼠标经过出现黑色边框 */ .abc:hover{ color:#F00}/* 对象.abc鼠标经过其内容css字体颜色变红色 */
세 가지 실험의 해당 HTML 소스 코드:
<!-- html注释:1 鼠标经过图片变大 --> <img src="div -logo-2013.gif" alt="DIV LOGO" /> <!-- 2 鼠标经过li出现边框 --> <ul> <li>对li设置hover样式,鼠标经过加CSS边框</li> </ul> <!-- 3 鼠标经过abc盒子内文字变为红色 --> <div class="abc">对.abc:hover,鼠标经过时候文字颜色变红</div>
호버를 지원하지 않는 브라우저에 대한 솔루션이 너무 많아서 도움이 필요한 친구가 저장할 수 있습니다. , 이 사이트의 기타 업데이트에 계속 관심을 가져주세요.
관련 읽기:
텍스트위 내용은 ie6에서는 hover를 지원하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!