CSS 스타일 에 대한 자세 한 설명!important、*、

CSS 스타일 에 대한 자세 한 설명!important、*、_기호.
!important、*、_사실 아무 소 용이 없습니다.모두 스타일 의 우선 순 위 를 설정 하 는 데 사 용 됩 니 다.그러나 스타일 의 우선 순 위 는 스스로 선후 위 치 를 정 해서 설정 할 수 있 습 니 다.그러나 알 아 보 셔 야 합 니 다.
CSS 는 서로 다른 곳 에 서로 다른 우선 순위,.css 파일 의 정의<요소 style 의 속성 이 있 음 을 알 고 있 습 니 다.하지만 사용 하면!important,일이 달라 집 니 다.
먼저 다음 코드 를 보십시오.


<!DOCTYPE HTML> 
<html> 
<head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  <title>!Important</title>  
</head>  
<body> 
  <div style="color:blue !important;color:red;"> 
       
  </div> 
</body> 
</html>

"하하"두 글 자 는 두 개의 color 로 정의 되 었 습 니 다.원래 color:red 는 color:blue 다음 에 이 두 글 자 는 빨간색 이 어야 합 니 다.기본적으로 글꼴 에 가장 가 까 운 색 을 가 져 옵 니 다.
그런데 color:blue 다음 에 추 가 했 어 요!important,color:blue 의 우선 순위 가 가장 높 습 니 다."하하"라 는 두 글 자 는 파란색 이 어야 합 니 다.구체 적 인 효 과 는 다음 과 같 습 니 다.

그러나 IE6 는 style 속성 중의 것 을 식별 할 수 없습니다!important 기호 때문에 원래 의 스타일 우선 순위 에 따라'하하'라 는 두 글 자 를 빨간색 으로 만 들 었 습 니 다.
css 스타일 중!important、*、_기 호 는 모두 우선 순 위 를 설정 하 는 데 사 용 됩 니 다.그러나 이 기 호 는 특정한 브 라 우 저 에서 만 적 용 됩 니 다.구체 적 으로 다음 과 같 습 니 다.
IE 모두 식별 가능*;표준 브 라 우 저(예 를 들 어 FF)는 식별 할 수 없습니다*;
IE6 는 식별 할 수 있 지만 식별 할 수 없습니다!important;
IE7 식별 가능*,식별 가능!important;
FF 는 식별 할 수 없 지만 식별 할 수 있 습 니 다!important;
밑줄"",IE6 는 밑줄 을 지원 하고 IE7 과 Firefox 는 밑줄 을 지원 하지 않 습 니 다.
따라서 style 속성 에서 다음 과 같은 속성 을 정의 하여 IE6,IE7,firefox 를 구분 할 수 있 습 니 다.


background:orange;*background:green;_background:blue;

IE6,IE7,firefox 를 이렇게 구분 할 수 있 습 니 다.


background:orange;*background:green !important;*background:blue;

다음 코드:


<!DOCTYPE HTML> 
<html> 
<head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  <title>!Important</title>  
</head>  
<body> 
  <div style="background:orange;*background:green !important;*background:blue;"> 
      IE7、IE8、   
  </div> 
  <div style="background:orange;*background:green;_background:blue;"> 
      IE7、IE8、   
  </div> 
</body> 
</html>

그 운행 효 과 는 다음 과 같다.
（1）IE7

(2)IE8 과 그 이상 의 브 라 우 저,불 여우 등 을 포함한다.

（3）IE6

그러나 이러한 차 이 는 스스로 디 버 깅 에 만 사용 할 수 있 습 니 다.진정한 전단 프로 그래 밍 은 자바 스 크 립 트 를 이용 하여 브 라 우 저의 표지 판단 을 통 해 브 라 우 저의 유형 을 판단 해 야 합 니 다.
마지막 으로 한 마디 더 하 겠 습 니 다.사실 IE6 는 style 을 식별 할 수 없 을 뿐 입 니 다!important,코드 가 다음 과 같다 면:


<!DOCTYPE HTML> 
<html> 
<head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  <title>  Css  !Important  </title>  
  <style type="text/css"> 
    .testClass{  
    color:blue !important; 
    } 
  </style> 
</head> 
<body> 
  <div class="testClass" style="color:red;"> 
      Css  Important 
  </div> 
</body> 
</html>

ie6-10 이나 Firefox 와 Chrome 에서 모두 일치 하 며 파란색 으로 표 시 됩 니 다.
궁금 한 점 이 있 으 시 면 메 시 지 를 남기 거나 본 사이트 의 커 뮤 니 티 에 가서 토론 을 교류 하 세 요.읽 어 주 셔 서 감사합니다. 도움 이 되 셨 으 면 좋 겠 습 니 다.본 사이트 에 대한 지지 에 감 사 드 립 니 다!

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

jQuery toggle()설정 CSS 스타일

toggle()요소 의 보 이 는 상 태 를 전환 합 니 다.요소 가 보 이 는 경우 숨겨 진 것 으로 전환 합 니 다.만약 요소 가 숨겨 져 있다 면 볼 수 있 는 것 으로 전환 합 니 다.－－－－－－－－－－－－－...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

CSS 스타일 에 대한 자세 한 설명!important、*、_기호.

좋은 웹페이지 즐겨찾기