Normalmente, o estilo da página que os usuários veem será controlado por três camadas. A primeira camada é o estilo padrão do navegador, a segunda camada é o estilo definido pela página da web e a terceira camada é o estilo definido pelo usuário. Assim como o CSS, os últimos têm prioridade mais alta que os anteriores, o que significa que os estilos definidos pela página da web podem substituir os estilos padrão do navegador, e os estilos definidos pelo usuário têm a prioridade mais alta. A situação real é que, embora os navegadores forneçam mais ou menos a função de estilos definidos pelo usuário, muito poucos usuários irão personalizá-los e geralmente são usuários avançados. Os estilos padrão dos navegadores geralmente têm configurações diferentes em navegadores diferentes, versões de idiomas diferentes e até mesmo versões de sistema diferentes. Isso faz com que as páginas que usam diretamente o estilo padrão sejam exibidas de forma muito inconsistente em vários navegadores, portanto, há um problema semelhante a. O reset do YUI é usado para tentar reescrever as configurações padrão do navegador para garantir consistência nos estilos de cada navegador.
Tomemos as fontes como exemplo. O tipo de fonte padrão, o tamanho da fonte e a altura da linha da fonte de cada navegador são diferentes. Por exemplo, quando a versão chinesa do IE8 exibe páginas da web no Windows XP, a fonte padrão é Song Dynasty, mas isso é certamente. não é o caso da versão em inglês. Portanto, precisamos definir uniformemente o estilo de fonte padrão para obter efeitos de exibição consistentes, garantir a consistência do design e melhorar a eficiência do desenvolvimento.
No futuro, prepare-se para usar o seguinte estilo de fonte padrão:
body{ font: 12px/1.5 arial; }A maioria dos caracteres de conteúdo em nossas páginas estão em chinês. Não há dúvida de que a fonte mais comumente usada e comum para exibir chinês em páginas da web é Song Dynasty, mas Song Dynasty é muito ruim para exibir inglês, números e símbolos em inglês . como o caractere ©, geralmente esperamos exibi-los com melhores estilos de fonte por meio de CSS e, em seguida, usar Song Dynasty para exibir símbolos chineses e chineses. A razão pela qual escolhi arial é porque:
tahoma e helvetica não têm tanta sorte.font: 12px/1 Tahoma, Helvetica, Arial, "5b8b4f53", sans-serif;
Esta é uma escolha muito boa, mas você também descobrirá que novas versões do Google, YAHOO, Youtube, Bing e até MSN usam arial como primeira fonte padrão. Portanto, arial deve ser totalmente aceitável em termos de beleza e legibilidade.font-family:arial,sans-serif; mas pelo menos na versão não chinesa do. Win7 quando a codificação é GBK, o IE8 renderizará a fonte Song devido ao sans-serif , fazendo com que a fonte seja deformada. É por isso que o Taobao precisa adicionar a fonte Song antes sans-serif , mas o Google não precisa fazer isso.font-family:arial; o que pode ilustrar a segurança de fazer isso. Algumas pessoas podem ter notado que a fonte chinesa padrão exibida no Firefox China é Microsoft Yahei. Isso ocorre porque a Mouzhi Network modificou o estilo definido pelo usuário sem autorização e não permite que o estilo da página da web substitua o estilo definido pelo navegador. . É também por causa de situações semelhantes que é muito importante para nós projetar páginas da web com flexibilidade. Um dos problemas causados pelo uso de fontes em inglês como primeira fonte padrão é o problema de alinhamento quando chinês, inglês e símbolos são misturados . A maioria das situações pode ser resolvida definindo a altura da linha e o hasLayout, mas não será perfeito se você alterar. a fonte Alterá-la para "Song Ti" pode resolver completamente o problema. Aparentemente, esse problema ocorre apenas no IE. Portanto, se o seu site raramente usa inglês, números e símbolos em inglês, definir diretamente {font-family:5b8b4f53;} também é uma escolha razoável.
font:13px/1.231 arial,helvetica,clean,sans-serif; ou seja, o tamanho da fonte padrão é 13px, a altura da linha é 13*1.231=16.003px e a altura da linha padrão é 1.231 vezes. a fonte padrão. Para chinês, os tamanhos de fonte comumente usados são 12px, 14px, 16px, 18px e outros tamanhos pares. Definir a altura da linha para um número par no IE6 e IE7 pode resolver o problema de alinhamento da fonte em alguns casos especiais.line-height , tome cuidado para não usar unidades (incluindo %) , porque os nós filhos herdarão o valor calculado da altura da linha, portanto, ao usar unidades, o navegador calculará line-height como o primeiro valor definido. O valor não muda conforme o tamanho da fonte muda, e o valor sem unidade é um múltiplo do font-size do contêiner, portanto, defini-lo como um valor sem unidade é a melhor escolha.line-height e vale a pena ler.arial para reduzir o tempo de pesquisa do navegador.arial é basicamente a fonte com o nome mais curto, o que pode economizar tamanho CSS.{font-family:5b8b4f53;} , e ao usar Microsoft Yahei, é {font-family:5fae8f6f96c59ed1;} . Isto tem a vantagem de evitar problemas de codificação e pode ser suportado por todos os principais navegadores ao mesmo tempo.