Resumi como usar o CSS para alcançar a luz da borda e o efeito escuro da borda da tabela + BorderColordark + BorderColorlight. Então um internautas me perguntou por que ele escreveu um estilo CSS semelhante, mas ele só podia ver o efeito da fronteira da tabela normalmente sob ópera, e não havia nada sob o IE.
Saí da Opera9 e vi que era realmente o caso. O motivo não é complicado: porque no IE (o Firefox parece ser consistente com o IE), se o conteúdo de um TD estiver vazio, mesmo se você definir a altura e a largura, o estilo de fronteira desta célula não será exibido; O Opera usará o estilo para renderizar, independentemente de haver conteúdo ou não. Esta pergunta foi encontrada quando me formei. O chefe do departamento veio me perguntar naquele momento e depois eu disse a ele: basta adicioná -lo a todos os TD vazios. Toda vez que encontro esse problema no futuro, usarei esse método simples, grosseiro e eficaz para resolvê -lo.
Hoje, porém, tentei o meu melhor para estudá-lo algumas vezes e, de Jiarry, eu sabia que a sintaxe do CSS nos permitiu alterar esses comportamentos padrão: usando colapso de borda: colapso; e células vazias: mostre; Para fazer a fronteira desaparecer.
class = test1: adicione colapso de borda: colapso;
.test1 {
fronteira: 1px Solid #999999;
colapso da fronteira: colapso;
Largura: 60%
}
.test1 td {
fundo de fronteira: 1px Solid #999999;
Altura: 28px;
preenchimento-esquerda: 6px;
}
Classe1 Há conteúdo aqui
Há conteúdo aqui
class = test2: adicione colapso da borda: colapso; e células vazias: mostre;
.test2 {
borda: 1px preto sólido;
colapso da fronteira: colapso;
Largura: 60%
}
.test2 td {
fundo da borda: 1px preto sólido;
Altura: 28px;
preenchimento-esquerda: 6px;
células vazias: mostre;
}
Classe2 tem conteúdo aqui
Há conteúdo aqui
class = test3: sem colapso da borda: colapso; e células vazias: mostre;
.test3 {
fronteira: 1px Solid #999999;
Largura: 60%
}
.test3 td {
fundo de fronteira: 1px Solid #999999;
Altura: 28px;
preenchimento-esquerda: 6px;
}
Classe3 tem conteúdo aqui
Há conteúdo aqui