Por que o atributo 'Title' 'título' faz com que os navegadores ignorem meus estilos?

StackOverflow https://stackoverflow.com/questions/1959959

  •  21-09-2019
  •  | 
  •  

Pergunta

O seguinte documento HTML (juntamente com o CSS) falha em renderizar os estilos em b.css.

<!doctype html>
<html>
    <head>
        <link rel="stylesheet" media="screen" type="text/css" title="A" href="a.css" />
        <link rel="stylesheet" media="screen" type="text/css" title="B" href="b.css" />
    </head>
    <body>
        <div id="A">A</div>
        <div id="B">B</div>
    </body>
</html>

/* a.css */
div#A   { color: blue;  }
/* b.css */
div#B   { color: red;   }

Tornando os títulos iguais (por exemplo, ambos <link ... title="A"> Corrige, mas não vejo o motivo, por que deveria. O que o título está fazendo, aqui, isso faz isso errado?

Foi útil?

Solução

A especificação HTML 4.0 afirma que existem três tipos de folhas de estilo: persistente, preferido e alternativo.

  • Uma folha de estilo é "persistente" se estiver ligada a rel="stylesheet" e não tem title atributo. Todas as folhas de estilo persistentes são usadas ao renderizar.
  • Uma folha de estilo é "preferida" se estiver vinculada a rel="stylesheet" e tem um title atributo; folhas de estilo preferidas com o mesmo title estão agrupados, mas não deve haver mais de um grupo. Parece que os navegadores escolherão apenas uma folha de estilo preferida para renderizar, pois deve haver apenas uma.
  • Finalmente, uma folha de estilo é "alternativa" se estiver vinculada a rel="alternate stylesheet" e tem um title. Essas folhas de estilo devem permitir que o usuário escolha folhas de estilo, elas são agrupadas por title e apareça no seletor da folha de estilo do navegador, se tiver um (View >> estilo de página no Firefox). Cada grupo (por título) é mutuamente exclusivo.

Colocando title Atributos em suas folhas de estilo, você está involuntariamente transformando -as em folhas de estilo preferidas, em vez da folha de estilo persistente esperada. É também por isso que eles funcionam quando todos têm o mesmo título.

Outras dicas

Seguindo a resposta de Neil Williams:

Os autores podem especificar um número de Mutualmente exclusivo As folhas de estilo chamadas folhas de estilo alternativas .... agentes de usuários devem permitir que os usuários selecionem entre folhas de estilo alternativas.

(enfase adicionada)

Também:

Para tornar uma folha de estilo preferida, defina o atributo REL para "STILELES SHEET" e nomeie a folha de estilo com o atributo de título.

Isto é de http://www.w3.org/tr/rec-html40/present/styles.html#h-14.3.1

Leia isso: http://blogs.telerik.com/dimodimov/posts/08-05-15/title_attributes_in_css_link_tags_prevent_styles_from_being_applicied.aspx

Há algum tempo, já estou ciente de que os atributos do título nas tags CSS desencadeiam problemas e impedem que alguns estilos CSS sejam aplicados na página da web. Hoje eu investi algumas horas para descobrir o que realmente acontece e é isso que temos.

Se você tiver várias tags na página e uma delas tem um atributo de título, as tags que virão depois de terá um atributo de título com o mesmo valor ou nenhum atributo de título, caso contrário, os estilos neste último arquivos CSS, a vontade não ser aplicado na página.

A questão pode ser facilmente reproduzida em várias versões do Firefox, Opera e Safari. O único navegador, que não exibe o comportamento inesperado é o Internet Explorer.

Realmente estranho oo

Levei cerca de 3 horas para chegar ao final, pois eu estava adicionando uma nova folha de estilo. Eu pensei que tinha alguns conflitos entre as regras atuais do CSS e as que eu estava adicionando. Depois de ficar sem opções sãs, tentei remover a tag de título do link. Eu não pensei muito nisso, pensei que eram alguns metadados inúteis. Bem, aconteceu que era isso que estava impedindo que o CSS fosse analisado. Acontece que o obsoleto Comitê dos Padrões CSS do Brainfart criou isso. Eles não poderiam simplesmente ter adicionado um novo atributo que é mais claro, para a funcionalidade preferida e de outros enfeites (seja qual for, que deve fazer) em vez de confiar na presença ou ausência do atributo de título? Perdi todo esse tempo que deveria ser investido em fazer algo produtivo. Durante minha pesquisa, prometi a mim mesmo que tomaria medidas depois de encontrar a origem desse problema. Agora, resta para decidir sobre as medidas.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top