Criar website WordPress:
2.9 Criar menu flutuante apenas com CSS

Como vimos na aula anterior, é muito simples fazer alterações ao design de uma página utilizando CSS.

Nesta aula vamos colocar o menu a acompanhar a página quando fazemos scroll em menos de 5 minutos, apenas com CSS.

Depois vamos testar a velocidade de carregamento do site através do PageSpeed Insights.

Como podem ver no vídeo, basta adicionar o seguinte código a Personalizar->CSS adicional e vosso menu irá tornar-se flutuante.

.site-header {
    position: sticky;
    top: 0;
    box-shadow: 0 0 3px 0 rgb(62 28 131 / 10%);
    background-image: linear-gradient( 309deg,#fff 51%,#f8f9f8 100%);
    padding: 20px 40px;
    max-width: 100%;
    opacity: 0.9;
}

Aula Anterior

Próxima Aula