CSS에서 웃는 얼굴“:)”은 무엇을 의미합니까?

321

프로젝트 에서이 CSS 코드를 발견했습니다.

html, body { :)width: 640px;}

나는 오랫동안 CSS를 사용해 왔지만이 ":)"코드를 본 적이 없다. 그것은 무엇을 의미합니까 아니면 오타입니까?

css css-hack

— 표
소스

나에게 오타처럼 보인다. 개발자가 재미 있거나 자신이 찾게 될 코드 영역을 표시하는 방법은 무엇입니까?

— Lee

@stijn은 여전히 이상한 공급 업체 특정 코드 일 수 있습니다 ...

— Mark

@ series0ne Internet Explorer 별표 해킹을 본 적이 없습니다.

— Nit

이것이 실제로 브라우저 핵이라면 CSS 파일에 이것을 설명하는 주석을 추가하고 싶을 것입니다.

— user247702

내 추측 : 코드 작성자가 :) IM 클라이언트에 중점을두고 있다고 생각했습니다. 그들이 IM 클라이언트를 클릭하지 않았을 때 IM 클라이언트를 클릭했을 때 커서가 있던 마지막 위치에 CSS 파일 인 스마일을 입력하지 않았다는 것을 결코 깨닫지 못했습니다.

— Nathan

답변:

279

javascriptkit.com 의 기사에서 IE 7 및 이전 버전에 적용 됩니다.

*속성 이름 바로 앞에 별표 ( ) 와 같은 영숫자가 아닌 문자를 추가 하면 속성이 다른 브라우저가 아닌 IE에 적용됩니다.

또한 <= IE 8에 대한 해킹이 있습니다 .

div {
  color: blue;      /* All browsers */
  color: purple\9;  /* IE8 and earlier */
 *color: pink;      /* IE7 and earlier */
}

그러나 그것은 좋은 생각이 아니며, 검증하지 않습니다. 특정 버전의 IE 를 타겟팅 하기 위해 언제든지 조건부 주석 으로 작업 할 수 있습니다 .

<!--[if lte IE 8]><link rel="stylesheet" href="ie-8.css"><![endif]-->
<!--[if lte IE 7]><link rel="stylesheet" href="ie-7.css"><![endif]-->
<!--[if lte IE 6]><link rel="stylesheet" href="ie-6.css"><![endif]-->

그러나 실제로 해킹을보고 싶다면 최신 버전의 IE 에서이 페이지 를여십시오. 그런 다음을 수행하여 개발자 모드로 이동하십시오 F12. 에뮬레이션 섹션 ( ctrl+ 8)에서 문서 모드를 변경 7하고 결과를 확인하십시오.

여기에 이미지 설명을 입력하십시오

페이지에 사용 된 속성은 :)font-size: 50px;입니다.

— 레보
소스

선택기 전에 "_"와 "*"에 대해 알고 있었지만이 말은 아닙니다.

— valerio0999

@vlrprbttst 그것들은 쉽게 사용되는 일반적인 문자입니다. 그러나 영숫자가 아닌 모든 값을 마칩니다.

— revo

salman-a도 정확하지만 조금 느리지 만이 답변을 올바른 것으로 표시하고 있습니다. 이 핵을 알고 있었지만 항상 "*"를 사용했습니다. 이 페이지를 한 사람은 조커입니다.).

— Mark

나는 여기서 뭔가를 놓칠 정도로 어리석은 것일 수 있지만 왜 2자를 사용하여 그것을 할 수 있습니까? "하나 이상을 추가하십시오 ..."가 아니라 "비영 숫자를 추가하십시오"라고 표시되어 있습니다. 아니면 :다른 의미가 있습니까? 그렇지 않으면 *********************font-size: "150%";등을 넣을 수 없습니까?

— Max

이 답변에 추가 부분을 던지기 만하면됩니다. 대답은 훌륭하고 정확하지만 이것이 최선의 방법이 아니라는 사실을 놓치십시오. 일반적으로 사용자 기반이 사용하는 모든 브라우저에서 최상의 경험을 제공하기 위해 최선을 다해야합니다. 말할 것도없이, 당신은 그것을 만든 회사가 더 이상 지원하지 않는 브라우저를 지원해서는 안됩니다.

— AlienDev

171

IE7 및 이전 브라우저를 대상으로하는 CSS 해킹처럼 보입니다. 이 동안 이다 무효 CSS가와 브라우저는, IE7 무시하고 이전 구문 분석하고이 규칙을 존중. 다음은이 해킹의 예입니다.

CSS

body {
    background: url(background.png);
    :)background: url(why-you-little.png);
}

IE8 (규칙 무시)

예 1-IE8

IE7 (규칙 적용)

예 1-IE7

웃는 얼굴 일 필요는 없습니다. BrowserHacks 는 다음과 같이 언급합니다.

이러한 문자의 모든 조합 : [속성 이름이 작동하기 전에] Internet Explorer ≤ 7
! $ & * ( ) = % + @ , . / ` [ ] # ~ ? : < > |

GAH 핫도그 스탠드 예가 여기에 있습니다 .

— 살만 A
소스

GAH 핫도그 스탠드 플래시백

— MikeTheLiar

예, IE8 이상에서는 IE가 CSS와 호환되는 것으로 간주하고 IE 특정 CSS 수정 사항을 조금씩 깨뜨립니다. (따라서 우리는 자바 스크립트 솔루션에 의지해야합니다)

— Flip Vernooij

모든 사이트는 모든 <IE10 사용자에게 핫도그 스탠드 테마를 사용해야합니다. +1

— Pete TNT

@ikkuh 공정하게 말하면 IE11은 상당히 괜찮고 호환되는 브라우저입니다. 그들이 IE 조건부 주석에 대한 지원을 중단 한 이유가 있습니다.

— ajp15243

@ apj15243 그래, 그들은 먼 길을 갔고 그들이 계속 갈 수 있기를 희망한다. 진실은 여전히 그것에 대한 조건부 지원이 필요하다는 것이고, 그것은 IE11뿐만 아니라 10,9 및 8이기도하다. 또한 상업적 이유 외에는 XP에서 IE11을 실행하지 않을 이유가 없습니다. 그러나 그것은 다른 토론입니다.

— Flip Vernooij