1. Home page
  2. utilização Blocs
  3. Design
  4. Página Ativa de Navegação de Estilo
  1. Home page
  2. Tips
  3. Página Ativa de Navegação de Estilo

Página Ativa de Navegação de Estilo

Blocs permite controlar facilmente o estilo visual dos links de navegação que correspondem ao URL da página atual do navegador. Da perspectiva do usuário, isso ajuda a identificar qual página está sendo exibida no momento.


importante

Observe. Esta configuração não deveria ser confundido com a configuração de classe de estado ativo encontrada no Editor de classes.

Configurando a classe ativa

É muito fácil definir a classe ativa. Basta abrir o configurações do projeto e preencher o campo de entrada rotulado Classe de link ativo com o nome da classe que você gostaria de aplicar a um link de navegação quando ele corresponder ao URL da página atual.

As Blocs é baseado em Bootstrap 4, já existe uma classe ativa configurada por padrão que você pode usar. Basta inserir ativo no campo de entrada de classe de link ativo (encontrado no configurações do projeto) e todos os links da página ativa mudarão de cor quando estiverem ativos.

Estilizando a Classe Ativa

Para definir a aparência visual de uma classe de estado ativo personalizado, basta adicionar uma nova classe personalizada com o mesmo nome, por exemplo ativo via Gerente de Classe e depois personalizar os valores para a classe usando o Editor de classes.

Visualize a classe ativa

As classes ativas não são aplicadas ou exibidas dentro do Blocs ambiente de design, no entanto, eles são ativados no modo de visualização e quando você exporta e hospeda seu site.

Atualizado em 18th May 2021

Esse artigo foi útil?

Artigos Relacionados