Embora tenha um tópico aparentemente incrível, pode-se dizer que este artigo é um passatempo para pessoas com dores de estômago (como eu ~) ~ Geralmente os desenvolvedores têm sua própria maneira de relaxar. Originou-se de uma pergunta sobre fronteiras feita por alguém xd no fórum, então resolvi descobrir. Não demorou muito para escrever o artigo, mas demorou muito para preparar as fotos. Neste artigo, vamos dar uma olhada em como cada navegador entende as fronteiras.
Os navegadores participantes deste teste incluem quase todos os navegadores Windows: ie6, ie7, ie8, ie9preview, chrome, firefox, safari, opera, seamonkey. Cada versão é a versão mais recente baixada da Internet. E porque neste teste o desempenho do IE678 foi consistente, e o Firefox e o Seamonkey foram nepotismo, então eles foram fundidos no IE8 e no Firefox. A imagem abaixo é uma captura de tela deste navegador:
.jpg)
A ordem acima é intencional. Os motivos serão mostrados no teste abaixo, e as capturas de tela também estão organizadas nesta ordem.
Primeiro observe a imagem abaixo. Um DIV 20X20 é exibido em seis navegadores, com uma borda superior: 2px e o restante 1px. Parece não haver diferença. Isso ocorre porque a sutileza do 1px nos impede de prestar atenção. (Na verdade, não precisamos nos preocupar com toda essa questão~)
.jpg)
Primeiro simplifique o problema, um lado tem 2px, três lados têm 1px e aumente o resultado 5 vezes. Podemos ver claramente essa diferença - Opera e Safari são opostos, o IE8 não tem braços e pernas e os três caras a seguir são consistentes ~ aqui. Deve-se notar que a segunda linha de 3 tem um efeito gradual na intersecção.
.gif)
Talvez devêssemos tornar este efeito mais visível. Quando apenas um lado está em negrito (10px), as peculiaridades do IE8 são claramente reveladas. ópera e safari ainda são relativos. As três frentes unidas seguintes tornam-se gradualmente mais óbvias.
.gif)