CSS에서 해킹이란 무엇을 의미합니까?-CSS 튜토리얼-php.cn

집

웹 프론트엔드

CSS 튜토리얼

CSS에서 해킹이란 무엇을 의미합니까?

清浅

Dec 07, 2018 pm 04:36 PM

hack

CSS의 해킹은 우리가 원하는 페이지 효과를 제공할 수 있도록 다양한 브라우저와 버전에 대해 서로 다른 CSS 스타일을 작성하는 것입니다.

CSS 해킹은 주로 브라우저 호환성 문제를 해결하는 데 사용되며 다양한 브라우저는 서로 다른 CSS를 작성합니다. 그리고 다른 브라우저에서도 원하는 페이지 효과를 얻을 수 있습니다. 오늘은 기사

에서 어떤 해킹이 있는지 자세히 소개하겠습니다. 해킹의 정의: 해킹은 Internet Explorer, Firefox, Chrome 등 제조업체가 다른 브라우저 또는 동일한 제조업체의 브라우저 버전이 다르기 때문에 발생합니다. 생성된 페이지 효과도 다릅니다. 이때 서로 다른 브라우저와 호환되고 서로 다른 브라우저에서 얻을 수 있도록 서로 다른 브라우저에 대해 서로 다른 CSS를 작성해야 합니다. 즉, 해킹의 목적은 CSS 코드가 다른 브라우저와 호환되도록 만드는 것입니다
예: CSS3 속성을 작성할 때 아래와 같이 브라우저마다 다른 코드를 작성해야 하는 경우가 종종 있습니다

animation:5s;/*标准版*/
-moz-animation: 5s;/* Firefox */
-webkit-animation:5s;/* Safari 和 Chrome */
-o-animation:5s;/* Opera */

! 중요한 문제:

Internet Explorer 6 이하에서는 !important 식별자에 문제가 있습니다. 동일한 속성을 가진 다른 스타일이 동일한 스타일 선언 블록에 나타나면 해당 식별자가 무시됩니다. 이는 Internet Explorer 6 및 기타 브라우저가 무시하는 특수 속성 값을 제공하는 데 사용될 수 있습니다. 하지만 이 문제는 Internet Explorer 7 이상에서는 발생하지 않습니다

  p
 {
     background: green !important;
     background: red; 
         }
      </style>
   </head>
   <body class="page-body">
      <p>Test</p>

IE 브라우저의 F12 디버깅 도구를 통해 IE 버전을 전환하여 실행 효과를 확인할 수 있습니다

IE5:

IE8:

*HTML 문제

hack 부분의 코드는 별표 "*" 다음에 "html"로 표시됩니다. 이는 범용 선택자와 요소 유형 선택자의 조합입니다. 어느 시점에서 다른 선택기 전에 이 두 선택기가 함께 사용되면 일부 하위 버전의 브라우저에서만 효과가 있고 다른 브라우저에서는 효과가 없습니다. 아무런 효과가 없더라도 실제로는 효과적이므로 오류를 보고하지 않습니다.

CSS에서 해킹이란 무엇을 의미합니까?

*html p
         {
            background: green;
            background: red; 
         }
      </style>
   </head>
   <body class="page-body">
      <p>Test</p>

IE5:

CSS에서 해킹이란 무엇을 의미합니까?

IE8:

요약: 위 내용은 이 글의 전체 내용입니다. , 이 기사가 모든 사람에게 해킹에 대한 확실한 이해를 줄 수 있기를 바랍니다

위 내용은 CSS에서 해킹이란 무엇을 의미합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

관련 기사

CSS 그리드는 무엇입니까?Apr 30, 2025 pm 03:21 PM

CSS 그리드는 복잡하고 반응이 좋은 웹 레이아웃을 만드는 강력한 도구입니다. 디자인을 단순화하고 접근성을 향상 시키며 이전 방법보다 더 많은 제어를 제공합니다.

CSS Flexbox 란 무엇입니까?Apr 30, 2025 pm 03:20 PM

기사는 반응 형 설계에서 공간의 효율적인 정렬 및 분포를위한 레이아웃 방법 인 CSS Flexbox에 대해 설명합니다. Flexbox 사용을 설명하고 CSS 그리드와 비교하고 브라우저 지원 세부 사항을 설명합니다.

CSS를 사용하여 웹 사이트를 반응하게 만드는 방법은 무엇입니까?Apr 30, 2025 pm 03:19 PM

이 기사는 Viewport Meta 태그, 유연한 그리드, 유체 미디어, 미디어 쿼리 및 상대 장치를 포함하여 CSS를 사용하여 반응 형 웹 사이트를 만드는 기술에 대해 설명합니다. 또한 CSS 그리드 및 Flexbox를 함께 사용하여 CSS 프레임 워크를 권장합니다.

CSS 박스 크기 부동산은 무엇을합니까?Apr 30, 2025 pm 03:18 PM

이 기사는 요소 치수 계산 방법을 제어하는 CSS 박스 크기 속성에 대해 설명합니다. Content-Box, Border-Box 및 Padding-Box와 같은 값과 레이아웃 설계 및 형태 정렬에 미치는 영향을 설명합니다.

CSS를 사용하여 어떻게 애니메이션 할 수 있습니까?Apr 30, 2025 pm 03:17 PM

기사는 CSS, 주요 특성 및 JavaScript와 결합 된 애니메이션 작성에 대해 논의합니다. 주요 문제는 브라우저 호환성입니다.

CSS를 사용하여 프로젝트에 3D 변환을 추가 할 수 있습니까?Apr 30, 2025 pm 03:16 PM

기사는 3D 변환, 주요 속성, 브라우저 호환성 및 웹 프로젝트에 대한 성능 고려 사항에 대한 CSS 사용에 대해 논의합니다. (문자 수 : 159)

CSS에 기울기를 추가 할 수있는 방법은 무엇입니까?Apr 30, 2025 pm 03:15 PM

이 기사는 CSS 그라디언트 (선형, 방사형, 반복)를 사용하여 웹 사이트 비주얼을 향상시키고 깊이, 초점 및 현대적인 미학을 추가합니다.

CSS의 의사 요소는 무엇입니까?Apr 30, 2025 pm 03:14 PM

기사는 CSS의 의사 요소, HTML 스타일을 향상시키는 데 사용 및 의사 급의 차이점에 대해 설명합니다. 실제 사례를 제공합니다.

See all articles

핫 AI 도구

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

AI 옷 제거제

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

mPDF

mPDF는 UTF-8로 인코딩된 HTML에서 PDF 파일을 생성할 수 있는 PHP 라이브러리입니다. 원저자인 Ian Back은 자신의 웹 사이트에서 "즉시" PDF 파일을 출력하고 다양한 언어를 처리하기 위해 mPDF를 작성했습니다. HTML2FPDF와 같은 원본 스크립트보다 유니코드 글꼴을 사용할 때 속도가 느리고 더 큰 파일을 생성하지만 CSS 스타일 등을 지원하고 많은 개선 사항이 있습니다. RTL(아랍어, 히브리어), CJK(중국어, 일본어, 한국어)를 포함한 거의 모든 언어를 지원합니다. 중첩된 블록 수준 요소(예: P, DIV)를 지원합니다.