Tiago Torquato de Oliveira

OLA PESSOAL TUDO BEM?

PRECISO AJUDA DE VCS.. EU ESTOU ESTUDANDO CURSO DESENVOLVEDOR FULL STACK PHYNTON E O PROFESSOR NA PLATARFORMA PEDIU EXERCICIO A FORMULARIO DO CADASTRO.

ALGUEM TEM CODIGO DO FORMULARIO DO CADASTRO?

PRECISO HTML, CSS, JAVASCRIPT E JQUERY E PLUIG JQUERY.

PRECISO CAMPOS, NOME, ENDEREÇO, CEP, CPF, RG, DATA NASCIMENTO, CIDADE E ESTADO.

 

OLA PESSOAL TUDOBEM?

EU PRECISO AJUDA DE VCS...

TO PRECISANDOENTREGAR O PROFESSOR FAZENDO EXERCICO DO HTML E CSS EU ESTOU CRIANDO SITES CERTINHO DE CODIGO CODIGO MAS NO FORMULARIO DO CONTATO (NOME, E-MAIL, TELEGFONE E ENVIAR) NADA CONCRETO E INCLUSIVE EU ESTOU VERIFICANDO O ERRO MAS NAO ENCONTREI E ATE QUE EUDELETEI E COMEÇEI TUDO DE NOVO SÓ QUE DEU ERRO DE NOVO.

NA PRIMEIRA IMAGEM FICOU ASSIM.

QUERO FICAR IGUAL NA SEGUNDA IMAGEM.

VOU ENVIAR O CODIGO DO FORMULARIO (CONTATO)

EU IMPLORO E PEÇO AJUDA POR FAVOR.

NO HTML:

 

 </div>

    </div>

    </section>

    <section id="contact">

        <div class="ccontainer">

            <h2>Contato</h2>

            <div class="contact-methods">

                <h3>Fale Conosco</h3>

                <form>

                    <input type="text" placeholder="Seu nome"required />

                    <input type="email" placeholder="Seu e-mail"required />

                    <input type="tel" placeholder="Seu telefone (opcional)" />

                    <textarea placeholder="Sua mensagem" required></textarea>

                    <button type="submit">Enviar</button>

                </form>

            </div>

            <div>

                <h3>Nós Acompanhe</h3>

                <ul class="social-links">

                    <li>

                        <a href="#instagram" title="Siga-nos no Instagram">

                            <img src="./images/instagram.png" alt="logo do instagram" />

                        </a>

                    </li>

                    <li>

                        <a href="#facebook" title="Siga-nos no Facebook">

                            <img src="./images/facebook.png" alt="logo do facebook" />

                        </a>

                    </li>

                    <li>

                        <a href="#youtube" title="Visite nosso canal youtube">

                            <img src="./images/youtube.png" alt="logo do youtube" />

                        </a>

                    </li>

                </ul>

            </div>

            <div>

                <h3>Vem até nós</h3>

                <p>

                    Rua Dave Grohl Alley, 1969 - Warren - Ohio - EUA

                </p>

            </div>

        </div>

    </section>

    <footer>

        <div class="container">

            <p>

                &copy; Foo Fighters - Todos os direitos resevados - 2024

            </p>

        </div>

    </footer>

</body>

</html>

 

E NO MAIN.CSS:

*{

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}

 

header,

section h2,

section h3,

form button {

    font-family: "Rock Salt", cursive;

    font-weight: normal;

}

 

body, input, textarea {

    font-family: "RocknRoll One", sans-serif;

}

 

header {

    padding:16px 0;

    background-color: rgb(231, 209, 84);

    color: rgba(128, 128, 128, 0.889);

}

 

header nav li {

    display: inline;

    margin-left: 16px;

    font-size: 18px;

}

 

header nav li a {

    color: rgba(128, 128, 128, 0.889);

    text-decoration: none;

}

 

.container {

    max-width: 1280px;

    width: 100%;

    margin: 0 auto;

}

 

header .container {

    display: flex;

    align-items: center;

    justify-content: space-between;

}

 

header .container {

    align-items: flex-start;

}

 

section {

    padding: 24px 0;

}

 

section h2 {

    margin: 16px;

}

 

section {

    color: rgba(128, 128, 128, 0.889);

}

 

section p {

    margin: 8px;

    font-family: "Rock Salt", cursive;

}

 

section img {

    margin-right: 32px;

}

 

.social-links img {

    height: 24px;

}

 

.social-links li {

    display: inline;

    margin-right: 8px;

}

 

.social-links li a {

    text-decoration: none;

}

 

#contact .container {

    display: block;

}

 

.contact-methods {

    display: flex;

    justify-content: space-between;

}

 

form input,

form textarea,

form button {

    display: block;

    width: 32px;

    margin-bottom: 8px;

    padding: 8px;

}

 

form textarea {

    resize: none;

    height: 180px;

}

 

section h3 {

    margin-bottom: 16px;

}

 

form button {

    background-color:rgb(231, 209, 84);

    color: rgba(128, 128, 128, 0.889);

    border: none;

}

 

form button:hover {

    background-color: rgb(169, 155, 72);

}

 

form:focus, textarea:focus {

    outline-color:rgb(231, 209, 84);

}

 

footer {

    background-color: rgb(231, 209, 84);

    color: rgba(128, 128, 128, 0.889);

    padding: 16px 0;

}

 

#band {

    background-color: rgba(196, 173, 43, 0.69);

}

PESSOAL....TO NA DUVIDA E PRECISO AJUDE DE VCS!!!!!

EU ESTOU ESTUDANDO CURSO PROGRAMADOR E QUERIA SABER COMO FAÇO CRIAR MAIS DUAS SEÇOES NO LAYOUT CRIADO DURANTE O, POR EXEMPLO: ENTRETENIMENTO E TECNOLOGIA, AS NOVAS SEÇÔES DEVEM CONTER NOTICIAS DIFERENTES CORES: