Dicas úteis

Como fazer uma linha rastejante no site

Pin
Send
Share
Send
Send


Você já viu o movimento abrupto de rolagem de texto em um site? Você já se perguntou como foi feito? Você não precisa procurar informações em outro lugar! Esse texto de rolagem é chamado de marca de seleção. Pode ser feito em qualquer cor, pode ser rolado em qualquer direção e muito mais. Veja o Passo 1 abaixo para começar!

  1. 1 Abra o documento HTML, se ainda não o fez.
  2. 2 Coloque este código onde deseja que a marca de seleção esteja:
  3. 3 Selecione uma cor de fundo. Você pode alterar o plano de fundo da linha rastejante especificando um valor hexadecimal (HEX) ou um valor RGB (vermelho-verde-azul) após a parte "background-color:" do código (cor de fundo). O valor padrão acima, # 000080 é azul marinho cor. Uma lista completa de cores e seus significados podem ser encontrados.
  4. 4 Defina a direção da rolagem. Alterar atributo direção no código para qualquer um dos seguintes itens: direita (da esquerda para a direita), esquerda (da direita para a esquerda (padrão)), para cima (de baixo para cima) ou para baixo (de cima para baixo).
  5. 5 Indique o número de ciclos de execução da linha de rastejamento. Atributo laço pode ser alterado de acordo com as necessidades - controla quantas vezes a linha rastejante deve se mover. Se você deseja que ele se mova continuamente, abaixe-o.
  6. 6 Especifique o texto da linha de rastejamento. O texto dentro da tag e a tag rolará o texto na linha rastejante. Escreva o que você deseja exibir.
  7. 7 Defina a cor do texto. Adicionar atributo estilo discagem interna
  • Aqui está um simples código de rolagem de linha rastejante:

Esta é uma linha de rolagem de rolagem.

  • As linhas de rastreamento nos sites geralmente são um pouco irritantes.
  • Tenha cuidado ao alterar os atributos da linha rastejante.

Linha rastejante em HTML. Noções básicas de HTML para iniciantes. Lição número 9

Olá pessoal!
Continuando a aprender o básico do HTML.
Nesta lição vou contar e ensinar como fazer uma linha rasteira em um documento HTML. Esse é um tipo de animação primitiva em um site sem o uso de editores gráficos.
Uma linha rasteira pode ser usada para exibir notícias, promoções, uma mensagem publicitária e até mesmo para belos momentos de design (por exemplo: uma nuvem no céu se move no cabeçalho de um site). Eu acho que você encontrará a aplicação de uma linha em execução no seu site, e minha tarefa agora é informar como isso é feito e como fica na prática.
Para criar uma linha rasteira, use a tag:

* atributos para linha rastejante
cor de fundo do letreiro
Para colorir o fundo da linha de corrida, adicione o atributo "bgcolor" à tag "marquee":

Resultado:
Linha rastejante

○ altura e largura de uma linha de corrida
Para definir a altura e a largura da linha de rastejamento, adicione os atributos "width" e "height" à tag de letreiro:

○ comportamento da linha rastejante
Adicione o atributo "behavior" à marca de seleção com os seguintes valores:

rolagem - rolagem normal (padrão),

slide - a linha começa a partir de uma extremidade e para na outra,

alternativo - a linha se moverá de ponta a ponta

rolagem normal (padrão)

A linha rastejante cruzará de uma borda e parará em outra

a linha se moverá de ponta a ponta

○ direção da linha rastejante
Adicione o atributo direction com os seguintes valores à marca de seleção:

esquerda - move o texto para a esquerda (padrão),

right - move o texto para a direita,

para cima - movimento do texto de baixo para cima,

para baixo - movimento do texto de cima para baixo

mova o texto para a esquerda (padrão)

movimento do texto para a direita

movimento do texto de baixo para cima

movimento de texto de cima para baixo

○ velocidade da linha rastejante
Para ajustar a velocidade de movimentação da linha de rastejamento, adicione o atributo scrollamount à tag de letreiro:

Quanto maior o valor, maior a velocidade.

○ atraso da linha rastejante
Outro atributo com o qual você pode ajustar a velocidade. Quanto maior o valor, menor a velocidade. Adicione o atributo scrolldelay à tag de letreiro:

○ número de carrapatos
Se você precisar especificar um certo número de passagens de linha rastejante, adicione o atributo loop à tag de letreiro:

No exemplo, o valor é "2", o que significa que haverá apenas duas passagens.

○ recuos rastejantes
Se você precisar especificar o recuo nos lados esquerdo e direito, adicione o atributo "hspace" à tag de letreiro:

Como inserir uma imagem em uma linha rasteira

Para inserir uma linha rastejante em uma imagem, insira uma tag que você já conhece entre as tags para exibir a imagem:


Todos os atributos para a tag são válidos neste caso.

Atributos e Parâmetros

1. w - define a largura da linha de corrida em pixels / porcentagem. Aqueles familiarizados com html provavelmente estão familiarizados com esse atributo. Por exemplo:

  • w - define a largura para 40%, dependendo da largura do bloco em que o objeto está localizado,

2. height = "number / percent" - define a altura da linha de corrida em pixels / porcentagem. Um exemplo pode ser o mesmo que com o primeiro atributo. Por exemplo:

  • height = "400px" - define a altura para 400 pixels,
  • height = "30%" - define a altura para 30%, dependendo da altura do bloco em que o objeto está localizado,

Nota: se a linha rastejante consistir em apenas uma linha, a altura poderá ser omitida, pois ela será determinada automaticamente dependendo do tamanho da fonte, que é definido pelo parâmetro font-size: Npx.

3. bgcolor = "color" - define a cor de fundo do contêiner. Você pode selecionar uma cor na página: códigos de cores html. Nota: se o atributo bgcolor não estiver definido, o plano de fundo será a cor de plano de fundo da página.

4. behavior = "parameter" - este é um dos atributos mais importantes da linha de corrida. Ele define o comportamento da linha rastejante. Tem algumas opções diferentes:
• alternativo - a linha de corrida se move ciclicamente: da direita para a esquerda e depois da esquerda para a direita (corre entre as bordas). Por exemplo:

E assim esta linha aparece no site:

• rolagem - a linha rastejante se move para fora da área na direção que o atributo de direção indica (com o parâmetro) e depois repete em ciclos. Na minha opinião, esta opção é mais comum. Por exemplo:

5. direction = "parameters" - define a direção do movimento da linha de rastejamento. Pode levar os seguintes valores:
• para baixo - movimento de cima para baixo. Por exemplo:

6. hspace = "number" - define o recuo da linha horizontal para outros objetos. A tag img popular tem um atributo semelhante.

7. vspace = "number" - define o recuo vertical para outros objetos.

8. loop = "number" - quantas vezes você precisa rolar o conteúdo. O parâmetro especifica um número, que define o número de repetições. Nota: -1 significa um loop de rolagem infinito. O padrão é -1.

9. scrollamount = "number" - a velocidade da linha em movimento. O número define o número de pixels pelos quais o objeto se move em um único ciclo de relógio. Nota: A velocidade padrão é 6 pixels / s. Por exemplo:

10. scrolldelay = "number" - define o atraso entre as etapas da linha de rastejamento em milissegundos. Por exemplo:

No final, darei 2 exemplos do uso de linhas rastejantes. Exemplo usando um objeto div:

Assista ao vídeo: Watch Dogs 2 - DedSec hackeia São Paulo (Junho 2021).

Pin
Send
Share
Send
Send