Um Projeto da Magia Html Cliente Edges

or aparece na frente de seus elementos circundantes, sendo tudo igual. O que temos ao lado do atributo de estilo é, "left: 0px; top: 0px;" Com os valores esquerda e superior sendo zero a borda mímica é na borda esquerda da área de cliente da página. Em seguida, temos uma largura de 1px. Esta é a largura da aresta mímica. O resto das propriedades CSS são auto-explicativos com base no que nós cobrimos nas partes anteriores da série. O elemento HR por padrão aparece horizontalmente. Se você tentar fazê-lo vertical, por dado uma grande altura e largura pequena, não vai funcionar.

Este elemento é o ideal para a borda superior mímica. Quando o mouse está sobre ele, uma função chamada a doShiftDown () é chamado. Esta função prepara a página para mudar a calculadora (painel) para baixo. Os propósitos para o resto dos valores de elemento de RH são semelhantes aos da borda esquerda mímica. O Resto do CSS Você tem algumas propriedades de estilo em atributos de estilo. O resto das propriedades CSS estão na folha de estilo. Esta é a folha de estilo: As duas últimas declarações são para o elemento Texto calculadora de entrada e os botões da calculadora.

Se você cobriu o básico, então o resto das linhas do CSS deve ser auto-explicativo. A largura da borda do DIV exterior é 0px. Esta fronteira não precisa ter qualquer largura. O usuário não deve sequer sabem que o DIV exterior existe. Nas partes anteriores da série eu usei uma largura da borda para o propósito de ilustração. A propriedade position CSS para o elemento DIV interior é "relativa". Isto permite que ele se mova (em que a sua posição é alterada) dentro do div externa.

Mostrando o Painel Quando você quer o painel do lado esquerdo, a propriedade do elemento DIV exterior display é alterado para "bloquear". Desde o DIV exterior não tem fronteiras e é transparente, você não vê-lo. O elemento DIV interior é movido dentro dele para a direita. Quando você não quer, você pode fazê-la se mover dentro do DIV exterior para a esquerda; em seguida, a propriedade do elemento DIV exterior exibição é alterado novamente para "none".

Uma vez que o elemento DIV exterior tem um índice de Z-2, enquanto que o elemento de corpo tem um índice z de 0, tudo sendo igual, o elemento DIV exterior é sempre em frente (uma camada de cima) dos outros elementos da página. O elemento DIV exterior é exibida ou não. Desde o DIV exterior contém o DIV interior, o DIV interior é correspondentemente, seja exibido ou não. A mesma explicação aplica-se ao