Webleb - Snippets de Código -

Abrir no Editor Publique Seu Código

Recomendado

21 October 2025

Exemplo de Landing Page de Site de Filme

HTML

CSS

body {
    background: #44A08D;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #093637, #44A08D);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #093637, #44A08D); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    
}
.btn {
    cursor: pointer;
    position: relative;
    padding: 10px 20px;
    background: rgb(3, 247, 226);
    font-size: 28px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    transition: all 1s;
}
.btn:after, .btn:before {
    content: " ";
    width: 10px;
    height: 10px;
    position: absolute;
    border: 0px solid #fff;
    transition: all 1s;
}
.btn:after {
    top: -1px;
    left: -1px;
    border-top: 5px solid black;
    border-left: 5px solid black;
}
.btn:before {
    bottom: -1px;
    right: -1px;
    border-bottom: 5px solid black;
    border-right: 5px solid black;
}
.btn:hover {
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.btn:hover:before, .btn:hover:after {
    width: 100%;
    height: 100%;
}
.data-container {
    background: #ffebee;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

Recomendado

Exemplo de modelo HTML básico

carrinho passando

Exemplo de Landing Page de Site de Filme

HTML

CSS

JS

Recomendado

Exemplo de modelo HTML básico

carrinho passando

Exemplo de Landing Page de Site de Filme

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS