Aqueles de vocês que estão escrevendo HTML há muito tempo podem lembrar do elemento. Este foi um elemento específico do navegador que criou um banner de rolagem de texto na tela. Esse elemento nunca foi adicionado à especificação HTML e o suporte a ele variou amplamente entre os navegadores. As pessoas frequentemente tinham opiniões muito fortes sobre o uso desse elemento - tanto positivo quanto negativo. Mas se você amava ou odiava, isso servia ao propósito de tornar visível o conteúdo que transbordava os limites da caixa.
Parte da razão pela qual isso nunca foi totalmente implementado pelos navegadores, além da forte opinião pessoal, é que ele é considerado um efeito visual e, como tal, não deve ser definido pelo HTML, que define a estrutura. Em vez disso, os efeitos visuais ou de apresentação devem ser gerenciados por CSS. E o CSS3 adiciona o módulo de letreiro para controlar como os navegadores adicionam o efeito letreiro aos elementos.
Novas propriedades do CSS3
O CSS3 adiciona cinco novas propriedades para ajudar a controlar como seu conteúdo é exibido no letreiro digital: excesso de estilo, estilo de letreiro, marquise-play-count, direção do letreiro e marquise de velocidade.
As opções são Por último, alterna o conteúdo de um lado para o outro, deslizando para frente e para trás. Pode ser necessário usar prefixos de fornecedores para que os elementos de letreiro CSS funcionem. Eles são os seguintes: A última propriedade permite que você defina o quão grande ou pequeno as etapas devem ser, enquanto o conteúdo rola na tela na marquise. Para que seu letreiro funcione, você deve colocar os valores prefixados do fornecedor primeiro e segui-los com os valores da especificação CSS3. Por exemplo, aqui está o CSS de um letreiro que rola o texto cinco vezes da esquerda para a direita dentro de uma caixa de 200x50.excesso de estiloo excesso de estilo property (que eu também discuti no artigo CSS Overflow) define o estilo preferido para conteúdos que excedem a caixa de conteúdo. Se você definir o valor para linha de letreiro ou bloco de letreiro seu conteúdo vai deslizar para dentro e para fora para a esquerda / direitalinha de letreiro) ou para cima / baixo (bloco de letreiro).estilo de letreiroEssa propriedade define como o conteúdo será movido para a exibição (e para fora).rolagem, deslizar e alternar. Scroll começa com o conteúdo completamente fora da tela, e então se move pela área visível até que esteja completamente fora da tela novamente. O slide começa com o conteúdo completamente fora da tela e, em seguida, ele se move até que o conteúdo tenha se movido completamente para a tela e não haja mais conteúdo para deslizar na tela.marquise-play-countUma das desvantagens de usar o MARQUEE elemento é que a marquise nunca pára. Mas com a propriedade style marquise-play-count você pode definir o letreiro para girar o conteúdo para um determinado número de vezes.direção do letreiroVocê também pode escolher a direção que o conteúdo deve rolar na tela. Os valores frente e marcha ré baseiam-se na direcionalidade do texto quando o excesso de estilo é linha de letreiro e para cima ou para baixo quando o excesso de estilo é bloco de letreiro.Detalhes da direção do letreiro
excesso de estiloDireção da Linguagem frente marcha ré linha de letreiroltr esquerda certo rtl certo esquerda bloco de letreiro acima baixa marquise de velocidadeEssa propriedade determina a rapidez com que o conteúdo rola na tela. Os valores são lento, normale velozes. A velocidade real depende do conteúdo e do navegador que a exibe, mas os valores devem ser lento é mais lento que normal que é mais lento que velozes.Suporte ao Navegador das Propriedades do Marquee
CSS3 Prefixo do Fornecedor overflow-x: linha de letreiro;overflow-x: -webkit-marquee;estilo de letreiro-webkit-marquee-stylemarquise-play-count-webkit-marquee-repetitiondireção do letreiro: para a frente | reverso;-webkit-direção-marque: para frente | para trás;marquise de velocidadevelocidade-marquisesem equivalente Incremento de letreiro-webkit{ largura: 200px; altura: 50 px; espaço em branco: nowrap; estouro: oculto; overflow-x: -webkit-marquee; -webkit-marquee-direction: para a frente; -webkit-marquee-style: rolagem; -webkit-marquee-speed: normal; -webkit-marquee-increment: pequeno; -webkit-marquee-repetition: 5; overflow-x: linha de letreiro; direção do letreiro: para a frente; estilo de letreiro: rolagem; marquise-velocidade: normal; marquise-play-count: 5;}
