Verificação rápida do resumo mais recente do CSS Hack

Bloquear o navegador IE (ou seja, não será exibido no IE)

*:lang(zh) select {font:12px !important;} /*Especial para FF*/
select:empty {font:12px !important;} /*safari visível*/

Aqui select é o seletor, que pode ser alterado de acordo com a situação. A segunda frase é exclusiva do navegador Safari no MAC.

Reconhecido apenas pelo IE7

*+html {…}

Você pode usar este HACK quando precisar criar estilos apenas para o IE7.

IE6 e identificação abaixo

*html{…}

Preste atenção especial a este ponto. Muitos proprietários escreveram que é um HACK para o IE6. Na verdade, o IE5.x também pode reconhecer esse HACK. Outros navegadores não o reconhecem.

html/**/ >body select {……}

Esta frase tem o mesmo efeito que a frase anterior.

Apenas o IE6 não reconhece isso

select { display /*IE6 não reconhece*/:none;}

O principal aqui é separar um atributo e um valor através de comentários CSS, que são liberados antes dos dois pontos.

Apenas IE6 e IE5 não são reconhecidos

select/**/ { display /*IE6, IE5 não o reconhece*/:none;}

A diferença aqui da frase acima é que há um comentário CSS adicional entre o seletor e as chaves.

Apenas o IE5 não reconhece isso

select/*IE5 não reconhece*/ { display:none;}

Esta frase é o comentário na área de atributos removida da frase anterior. Apenas o IE5 não reconhece isso

Solução de modelo de caixa

selecione {largura: largura do IE5.x; largura da voz:""}"";

O método de compensação do modelo de caixa não é tratado por meio de !important. Isso precisa ficar claro.

flutuação clara

select:depois de {conteúdo:"."; display:block height:0;

No Firefox, quando todos os filhos estão flutuando, a altura do pai não pode cobrir completamente o filho inteiro. Então, use este HACK para limpar a flutuação e definir o pai uma vez, então esse problema pode ser resolvido.

Truncando reticências

selecione { -o-text-overflow:reticências;excesso de texto:reticências;espaço em branco:nowrap;

Esta é uma técnica muito boa que corta automaticamente o excesso de texto depois que ele excede o comprimento e termina com reticências. Acontece que o Firefox não oferece suporte atualmente.

Reconhecido apenas pelo Opera

@media all e (largura mínima: 0px){ selecione {……} }

Faça configurações separadas para o navegador Opera.

Acima estão alguns HACKs para escrever CSS. Eles são usados ​​​​para resolver problemas de compatibilidade local. Se você quiser separar o conteúdo de compatibilidade, você também pode tentar os seguintes filtros. Alguns desses filtros são escritos em CSS para importar estilos especiais por meio de filtros, e alguns são escritos em HTML para vincular ou importar estilos de patch necessários por meio de condições.

Filtre para IE5.x, apenas IE5.x é visível

Filtros IE5/MAC geralmente não são necessários

IE se for hack condicional

<!--[if IE]> Apenas IE <![endif]-->

Tudo o que o IE reconhece

<!--[se IE 5.0]> Somente IE 5.0 <![endif]-->

Somente o IE5.0 pode reconhecê-lo

<!--[if gt IE 5.0]> Somente IE 5.0+ <![endif]-->

IE5.0 pode ser reconhecido pelo IE5.5

<!--[if lt IE 6]> Somente IE 6- <![endif]-->

Reconhecido apenas pelo IE6

<!--[if gte IE 6]> Somente IE 6/+ <![endif]-->

Pode ser reconhecido pelo IE6 e IE5.x abaixo do IE6

<!--[if lte IE 7]> Somente IE 7/- <![endif]-->

Reconhecido apenas pelo IE7

O conteúdo acima pode não ser abrangente. Você pode se juntar a mim para resumir essas técnicas para fornecer conveniência para futuras consultas de trabalho. Ao mesmo tempo, gostaria de agradecer aos autores que pesquisaram esses HACKs.