Primeiro, vamos apresentar as quatro maneiras comuns de relacionar documentos HTML com CSS:
1. Use tags de link
| ＜link rel="stylesheet" type="text/css" href="sheet.css" /＞ |
2. Use elementos de estilo
＜tipo de estilo="texto/css"＞ corpo{plano de fundo:#fff;} h1{tamanho da fonte:2em;} ＜/estilo＞ |
3. Use a diretiva @import
＜tipo de estilo="texto/css"＞ @importar url(folha1.css); @import "planilha2.css"; ＜/estilo＞ |
| ＜p style="color:#f00;"＞Este é um texto em vermelho＜/p＞ |
Em aplicações práticas, o uso de estilos inline usando o atributo style não é recomendado. O XHTML1.1 padronizou seu uso como não recomendado. O motivo é simples. aparência de todo o documento por vantagens CSS.
Os três primeiros métodos usam tags de link e tags de estilo e têm as seguintes limitações no IE (incluindo IE6, IE7 e IE8 beta1):
◆ Somente o CSS associado aos primeiros 31 links ou tags de estilo do documento pode ser aplicado.
A partir do 32º, o CSS associado à sua tag será inválido. A documentação oficial do IE Todas as tags de estilo após as primeiras 30 tags de estilo em uma página HTML não serem aplicadas no Internet Explorer também menciona essa limitação, incluindo essa limitação em arquivos .xml usando .xsl. Mas parece que a quantidade errada foi escrita. Por favor, veja no IE:
◆ Uma tag de estilo só é válida para as primeiras 31 instruções @import.
Ignorado a partir da 32ª diretiva @import.
◆ Somente as primeiras 31 instruções @import de um arquivo css são efetivamente aplicadas.
Ignorado a partir da 31ª diretiva @import.
◆ Um arquivo CSS não pode exceder 288kb?
Esta notícia vem do Limite de tamanho de arquivo CSS do Internet Explorer.
As restrições do IE ao CSS não serão encontradas na maioria dos casos. Mesmo que a melhor solução seja encontrada, deve ser mesclar os arquivos CSS e as tags de resposta manualmente ou por meio de um programa de back-end para minimizar as solicitações HTTP. otimizando a renderização da página.