HTML Formulário de Ficha de Inscrição

André Da Silva Ventura · 14 de setembro de 2017

Bom dia!

Estou desenvolvendo uma Ficha de Inscrição / Cadastro para ser implementada em meu site, elaborei todo HTML do corpo da mesma, com todas as informações necessárias a serem preenchidas pelo usuário, porém não consigo adicionar um comando para que a mesma me envie um e-mail quando alguém preenchê-la nem sei como fazer para armazenar estes dados em um servidor.

Segue abaixo o HTML:

<html>
    <meta charset="UTF-8">
<link rel=”stylesheet” type=”text/css”>
    
<head>
    <title>WM Transformacional | Ficha de Inscri&ccedil;&atilde;o</title>
        <meta name="description" content="Recrutamento, treinamento, consultoria organizacional e todos os tipos de parceiros.">
        <link rel="shortcut icon" href="//wmtransformacional.com/____impro/1/onewebmedia/Transformacional_edited2.png?resize=16,16&amp;format=ico">
            <head class="body blockbody">
                <div class="component  stretch template" style="min-width:1000px;">
                <div class="self">
                <div class="row" style="min-height:253px;width:1000px;margin:auto;">
                <div class="extra" style="margin:3px 0px 0px 0px;min-width:100%;">
                <div class="chrome-border-fix image component  block id86CD912401D74198A4525ECE876770CC" style="width:1000px;">
                <div class="imageself self" style="width:1000px;height:250px;" onclick="if(event.target ===  this) {event.stopPropagation();}">
                    <a href="//wmtransformacional.com/index.html" title=""><img data-scalestrategy="fit" width="1000" height="250" class="mobile-fit" src="//wmtransformacional.com/____impro/1/onewebmedia/Cabe%C3%A7alho%20do%20site%20(1).png?etag=W%2F%2214a51-58f9055e%22&amp;sourceContentType=image%2Fpng&amp;ignoreAspectRatio&amp;resize=1000%2B250" style="display:block;"></a></div>
                </div>
</head>
<body>
    <form action="envia.php" method="post" enctype="text/plain" name="ficha" id="ficha">
    <h2><center>FICHA DE INSCRI&Ccedil&AtildeO</center></h2>
	<hr width=100% size=4px color=#1e90ff>
	<hr width=100% size=1px color=#1e90ff>
	<br></br>
    <style type="text/css">
hr {   margin-bottom:3px;   padding-bottom:0px;}
	</style>
	<h3>DADOS PESSOAIS</h3>
    <hr width=20% size=3px color=#1e90ff>
	<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
	<style type="text/css">
h3 {
   font-family: "Roboto", sans-serif;
   font-size: 15px;
   font-weight:bold;
    color: black;
    background-color: #ffffff}
  </style>
	<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
	<style type="text/css">
h2 {
   font-family: "Roboto", sans-serif;
   font-size: 30px;
   font-weight:bold;
    color: black;
    background-color: #ffffff}
  </style>
    <form action="#" method="post">
    <link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
    <style type="text/css">
	form, body, input, select, textarea, button {
   font-family: "Roboto", sans-serif;
   font-size: 15px;
   font-weight:regular;
    color: black;
    background-color: #ffffff}
    * {
    margin: 0;
    padding: 0;
}
 
fieldset {
    border: 0;
}

body, input, select, textarea, button {
    font-family: "Roboto" sans-serif;
    font-size: 1em;
}
 
.grupo:before, .grupo:after {
    content: " ";
    display: table;
}
 
.grupo:after {
    clear: both;
}
.campo {
    margin-bottom: 1em;
}
 
.campo label {
    margin-bottom: 0.2em;
    color: #3a3a3a;
    display: block;
}
fieldset.grupo .campo {
    float:  left;
    margin-right: 1em;
}
.campo input[type="text"],
.campo input[type="email"],
.campo input[type="url"],
.campo input[type="tel"],
.campo input[type="date"],
.campo select,
.campo textarea {
    padding: 0.2em;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    display: block;
}
 
.campo select option {
    padding-right: 1em;
}
 
.campo input:focus, .campo select:focus, .campo textarea:focus {
    background: #FFC;
}
.campo label.checkbox {
    font-size: 1.5em;
    background: #F90;
    border: 0;
    margin-bottom: 1em;
    color: #FFF;
    padding: 0.2em 0.6em;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
    color: #000;
    display: inline-block;
    margin-right: 1em;
    
}
 
.botao:hover {
    background: #1e90ff;
    box-shadow: inset 2px 2px 2px rgba(0,0,0,0.2);
    text-shadow: none;
}
 
.botao, select, label.checkbox {
    cursor: pointer;
    
}
.submit {
	font-size:16px;
	font-family:Arial;
	font-weight:bold;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	border:3px solid #1e8fff;
	padding:10px 18px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #1e8fff 5%, #1e8fff 100% );
	background:-ms-linear-gradient( top, #1e8fff 5%, #1e8fff 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e8fff', endColorstr='#1e8fff');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #1e8fff), color-stop(100%, #1e8fff) );
	background-color:#1e8fff;
	color:#ffffff;
	display:inline-block;
}.submit:hover {
	background:-moz-linear-gradient( center top, #1e8fff 5%, #1e8fff 100% );
	background:-ms-linear-gradient( top, #1e8fff 5%, #1e8fff 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e8fff', endColorstr='#1e8fff');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #1e8fff), color-stop(100%, #1e8fff) );
	background-color:#1e8fff;
}.submit:active {
	position:relative;
	top:1px;

    
}.req:after {
  content:" *"; 
  color: red;
}
</style>
    <fieldset class="grupo">
        <div class="campo">
            <label for="nome"class="required">Nome Completo<abbr class="req" title="required"></abbr></label> 
                <input type="text" id="nome" required="true"name="nome" placeholder="Insira seu nome completo" style="width: 31em" value=""/>
        </div>    
        <div class="campo">
            <label for="email">E-mail<abbr class="req" title="required"></abbr></label>
            <input type="email" id="email" required="true" name="email" placeholder="Ex.: [email protected]" style="width: 20em" value="" />
        </div>     
        <div class="campo">
            <label for="sexo">Sexo<abbr class="req" title="required"></abbr></label>
                <input type="radio" name="masculino+" value="op1"/> Masculino
                <input type="radio" name="feminino" value="op2"/> Feminino
        </div>    
        <div class="campo">
                <label for="cargo_pretendido">Cargo pretendido<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="cargo_pretendido" name="cargo_pretendido" placeholder="" required="required" style="width: 20em" value="" />
        </div>
        <div class="campo">
            <label for="rede-social">Rede Social<abbr class="req" title="required"></abbr></label>
                <input type="url" id="url" name="link" placeholder="Ex.: http://www.facebook.com/wmtransformacional" required="required" style="width: 26em"  value="" />
        </div>
        <div class=campo>
            <label for="data-de-nascimento">Data de Nascimento<abbr class="req" title="required"></abbr></label>
                <input type="date" name="datadenascimento" required="required" style="width: 10em"value="">
        </div>  
        
        <div class="campo">
            <label for="idade">Idade<abbr class="req" title="required"></abbr></label>
                <input type="text" id="idade" name="idade" required="required" style="width: 4em"  value=""/>
        </div>
    </fieldset>
    <fieldset class="grupo">
        <div class="campo">
            <label for="tel01">Telefone / Celular 01<abbr class="req" title="required"></abbr></label>
            <input type="tel" id="ddd1" name="telefone" placeholder="" required="required" style="width: 9em"  maxlength="11" value="" />
        </div>
        <div class="campo">
            <label for="operadora01">Operadora<abbr class="req" title="required"></abbr></label>
            <input type="text" id="operadora" name="operadora" placeholder="" required="required" style="width: 5em"  value="" />
        </div>
        <div class="campo">
            <label for="tel02">Telefone / Celular 02</label>
            <input type="tel" id="ddd1" name="telefone" placeholder="" style="width: 9em"  maxlength="11" value="" />
        </div>
        <div class="campo">
            <label for="operadora02">Operadora</label>
            <input type="text" id="operadora" name="operadora" placeholder="" style="width: 5em"  value="" />
        </div>
        <div class="campo">
            <label for="como-soube-de-nossa-empresa">Como soube de nossa empresa?<abbr class="req" title="required"></abbr></label>
            <select name="opcao" id="comosoubedenossaempresa" required="required">
                <option value="">
                <option value="op1">Google&#8314;</option>
                <option value="op2">Facebook</option>
                <option value="op3">Instagram</option>
                <<option value="op4">Pesquisa no Google</option>
                <option value="op5">Publica&ccedil;&atilde;o de vagas de emprego</option>
                <option value="op6">Recomenda&ccedil;&atilde;o de um amigo</option>
                <option value="op7">Outros</option>
            </select>    
        </div>
        <div class="campo">     
                <label for="religiao">Religi&atilde;o<abbr class="req" title="required"></abbr></label>
                <select name="religião" id="estado" required="required">
                    <option value="">
                    <option value="op1">Cat&oacute;lica</option>
                    <option value="op2">Evang&eacute;lica</option>
                    <option value="op3">Esp&iacute;rita</option>
                    <option value="op4">Judaica</option>
                    <option value="op5">Outras</option>
                </select>    
        </div>
    </fieldset>
    <fieldset class="grupo">
        
        <div class="campo">     
                <label for="estado-civil">Estado Civil<abbr class="req" title="required"></abbr></label>
                <select name="estado civil" id="estado" required="required">
                    <option value="">
                    <option value="casado (a)">Casado (a)</option>
                    <option value="solteiro (a)">Solteiro (a)</option>
                    <option value="Divorciado (a)">Divorciado (a)</option>
                    <option value="Viúvo (a)">Vi&uacute;vou</option><br>
                </select>    
        </div> 
        <div class="campo">
                <label for="nome-do-conjuge"class="required">Nome do (a) C&ocirc;njuge</label>
                <input type="text" id="nome" name="nome" placeholder="" style="width: 24em" value="" />
        </div>   
        <div class="campo">
                <label for="profissao-do-conjuge"class="required">Profiss&atilde;o do (a) C&ocirc;njuge</label>
                <input type="text" id="nome" name="nome" placeholder="" style="width: 15em" value="" />
        </div>
        <div class="campo">     
                <label for="filhos">Tem Filhos?<abbr class="req" title="required"></abbr></label>
                <select name="filhos" id="filhos" required="required">
                    <option value="">
                    <option value="Não">N&atilde;o</option>
                    <option value="Sim, tenho 01 (um) filho">Sim, tenho 01 (um) filho</option>
                    <option value="Sim, tenho 02 (dois) filhos">Sim, tenho 02 (dois) filhos</option>
                    <option value="Sim, tenho 03 (três;s)">Sim, tenho 03 (tr&ecirc;s) filhos</option><br>
                </select>    
        </div> 
    </fieldset>
    <fieldset class="grupo"> 
        <div class="campo">
            <label for="naturalidade">Sua naturalidade (Cidade / Estado)<abbr class="req" title="required"></abbr></label>
            <input type="text" id="cidade" name="cidade" required="required" placeholder=""style="width: 20em"  value="" />
        </div>
        <div class="campo">     
                <label for="veiculo">Ve&iacute;culo<abbr class="req" title="required"></abbr></label>
                <select name="veículo" id="veiculo" required="required">
                    <option value="">
                    <option value="Não">N&atilde;o</option>
                    <option value="Sim">Sim</option><br>
                </select>    
        </div> 
        <div class="campo">     
                <label for="categoria">Habilita&ccedil;&atilde;o<abbr class="req" title="required"></abbr></label>
                <select name="categoria" id="veiculo" required="required">
                    <option value="">
                    <option value="Não">N&atilde;o</option>
                    <option value="Categoria A">Categoria A</option>
                    <option value="Categoria B">Categoria B</option>
                    <option value="Categoria C">Categoria C</option>
                    <option value="Categoria D">Categoria D</option>
                    <option value="Categoria E">Categoria E</option>
                </select>    
        </div>  
        <div class="campo">
            <label for="cpf">CPF<abbr class="req" title="required"></abbr></label>
            <input type="text" id="operadora" name="operadora" placeholder="" required="required" style="width: 9em"  value="" />
        </div>
        <div class="campo">
            <label for="ci/rg">CI/RG<abbr class="req" title="required"></abbr></label>
            <input type="text" id="operadora" name="operadora" placeholder="" required="required" style="width: 9em"  value="" />
        </div>
        <div class="campo">
            <label for="orgao-emissor">Org&atilde;o Emissor/UF<abbr class="req" title="required"></abbr></label>
            <input type="text" id="operadora" name="operadora" placeholder="" required="required" style="width: 8em"  value="" />
        </div>
    </fieldset>
    <fieldset class="grupo">    
        <div class="campo">
                <label for="nome-da-mae"class="required">Nome da M&atilde;e<abbr class="req" title="required"></abbr></label>
                <input type="text" id="nome" name="nome" placeholder="Insira o nome aqui" required="required"style="width: 26em" value="" />
        </div>   
        <div class="campo">
                <label for="profissao-da-mae"class="required">Profiss&atilde;o da M&atilde;e<abbr class="req" title="required"></abbr></label>
                <input type="text" id="nome" name="nome" placeholder="Insira o nome aqui" required="required" style="width: 18em" value="" />
        </div>
        <div class="campo">
                <label for="nome-do-pai"class="required">Nome do Pai</label>
                <input type="text" id="nome" name="nome" placeholder="Insira o nome aqui" style="width: 26em" value="" />
        </div>   
        <div class="campo">
                <label for="profissao-do-pai"class="required">Profiss&atilde;o do Pai</label>
                <input type="text" id="nome" name="nome" placeholder="Insira o nome aqui" style="width: 18em" value="" />
        </div>
    </fieldset>
    
    <h3>RESID&Ecirc;NCIA</h3>
    <hr width=20% size=3px color=#1e90ff>
	<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
	<style type="text/css">
h3 {
   font-family: "Roboto", sans-serif;
   font-size: 15px;
   font-weight:bold;
    color: black;
    background-color: #ffffff}
  </style>
  <fieldset class="grupo">
    <div class="campo">
            <label for="redencia">Sua resid&ecirc;ncia &eacute;<abbr class="req" title="required"></abbr></label>
                <select name="filhos" id="veiculo" required="required">
                    <option value="">
                    <option value="Pr&oacute;pria">Pr&oacute;pria</option>
                    <option value="Alugada">Alugada</option><br>
                </select>
        </div> 
        <div class="campo">
                <label for="endereco">Endere&ccedil;o<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="cargo_pretendido" name="cargo_pretendido" placeholder="Ex.: Nome da Rua, 00, Bloco 00, Apto. 000" required="required" style="width: 33em" value="" />
        </div>
        <div class="campo">
                <label for="bairro">Bairro<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="cargo_pretendido" name="cargo_pretendido" placeholder="Ex.: Nome da Rua, 00, Bloco 00, Apto. 000" required="required" style="width: 21em" value="" />
        </div>
        <div class="campo">
                <label for="cep">CEP<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="cargo_pretendido" name="cargo_pretendido" placeholder="" required="required" style="width: 10em" value="" />
        </div>
        <div class="campo">
                <label for="cidade">Cidade<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="cargo_pretendido" name="cargo_pretendido" placeholder="Ex.: 00.000-000" required="required" style="width: 20em" value="" />
        </div>
    </fieldset>    
 
 <h3>FORMA&Ccedil;&Atilde;O ACAD&Ecirc;MICA</h3>
    <hr width=20% size=3px color=#1e90ff>
	<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
	<style type="text/css">
h3 {
   font-family: "Roboto", sans-serif;
   font-size: 15px;
   font-weight:bold;
    color: black;
    background-color: #ffffff}
   </style>
    <fieldset class="grupo">
    <div class="campo">
            <label for="ensino-medio">Ensino M&eacute;dio<abbr class="req" title="required"></abbr></label>
                <select name="filhos" id="veiculo" required="required">
                    <option value="">
                    <option value="op1">Completo</option>
                    <option value="op2">Incompleto</option><br>
                    <option value="op3">Incompleto (Cursando)</option>
                    <option value="op4">Ainda n&atilde;o iniciei este curso</option>
                </select>
        </div>
        <div class="campo">
                <label for="instituicao-de-ensino-medio">Institui&ccedil;&atilde;o de Ensino</label>
                    <input type="text" id="instituição de ensino" name="instituiçãodeensino" placeholder="" style="width: 32em" value="" />
        </div>
        <div class="campo">
                <label for="inicio-de-curso-medio">In&iacute;cio do Curso</label>
                    <input type="text" id="inicio-de-curso" name="inicio-de-curso" placeholder="" style="width: 6em" value="" />
        </div>
        <div class="campo">
                <label for="termino-de-curso-medio">T&eacute;rmino do curso</label>
                    <input type="text" id="termino-de-curso" name="termino-de-curso" placeholder="" style="width: 6em" value="" />
        </div>
        </fieldset>
        <fieldset class="grupo">
        <div class="campo">
            <label for="ensino-superior">Ensino Superior<abbr class="req" title="required"></abbr></label>
                <select name="filhos" id="veiculo" required="required">
                    <option value="">
                    <option value="op1">Completo</option>
                    <option value="op2">Incompleto</option><br>
                    <option value="op3">Incompleto (Cursando)</option>
                    <option value="op4">Ainda n&atilde;o iniciei este curso</option>
                </select>
       </div>
        <div class="campo">
                <label for="instituicao-de-ensino-superior">Institui&ccedil;&atilde;o de Ensino</label>
                    <input type="text" id="instituição de ensino" name="instituiçãodeensino" placeholder="" style="width: 32em" value="" />
        </div>
        <div class="campo">
                <label for="inicio-de-curso-superior">In&iacute;cio do Curso</label>
                    <input type="text" id="inicio-de-curso" name="inicio-de-curso" placeholder="" style="width: 6em" value="" />
        </div>
        <div class="campo">
                <label for="termino-de-curso-superior">T&eacute;rmino do Curso</label>
                    <input type="text" id="termino-de-curso" name="termino-de-curso" placeholder="" style="width: 6em" value="" />
        </div>
        <div class="campo">
                <label for="curso-superior">Curso</label>
                    <input type="text" id="curso" name="curso" placeholder="" style="width: 25em" value="" />
        </div>
        <div class="campo">
                <label for="periodo-superior">Per&iacute;odo</label>
                    <input type="text" id="periodo" name="periodo" placeholder="" style="width: 10em" value="" />
        </div>
        </fieldset>
        <fieldset class="grupo">
        <div class="campo">
            <label for="pos">P&oacute;s Gradua&ccedil;&atilde;o<abbr class="req" title="required"></abbr></label>
                <select name="filhos" id="veiculo" required="required">
                    <option value="">
                    <option value="op1">Completo</option>
                    <option value="op2">Incompleto</option><br>
                    <option value="op3">Incompleto (Cursando)</option>
                    <option value="op4">Ainda n&atilde;o iniciei este curso</option>
                </select>
        </div>
        <div class="campo">
                <label for="instituicao-de-ensino-pos">Institui&ccedil;&atilde;o de Ensino</label>
                    <input type="text" id="instituição de ensino" name="instituiçãodeensino" placeholder="" style="width: 32em" value="" />
        </div>
        <div class="campo">
                <label for="inicio-de-curso-pos">In&iacute;cio do Curso</label>
                    <input type="text" id="inicio-de-curso" name="inicio-de-curso" placeholder="" style="width: 6em" value="" />
        </div>
        <div class="campo">
                <label for="termino-de-curso-pos">T&eacute;rmino do Curso</label>
                    <input type="text" id="termino-de-curso" name="termino-de-curso" placeholder="" style="width: 6em" value="" />
        </div>
        <div class="campo">
                <label for="curso-pos">Curso</label>
                    <input type="text" id="curso" name="curso" placeholder="" style="width: 25em" value="" />
        </div>
        <div class="campo">
                <label for="periodo-pos">Per&iacute;odo</label>
                    <input type="text" id="periodo" name="periodo" placeholder="" style="width: 10em" value="" />
        </div>
        <div class="campo">
                <label for="ooutras-opções">Outras op&ccedil;&otilde;es curso</label>
                    <textarea cols="137" rows="3"></textarea>
        </div>
        </fieldset>
    <h3>EXPERI&Ecirc;NCIA PROFISSIONAL</h3>
    <hr width=20% size=3px color=#1e90ff>
	<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
	<style type="text/css">
h3 {
   font-family: "Roboto", sans-serif;
   font-size: 15px;
   font-weight:bold;
    color: black;
    background-color: #ffffff}
   </style>  
    <fieldset class="grupo">
        <div class="campo">
                <label for="ultimo-emprego">&Uacute;ltimo Emprego<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="instituição de ensino" name="instituiçãodeensino" placeholder="" style="width: 30em" value="" />
        </div>
        <div class="campo">
                <label for="cargo">Cargo<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="inicio-de-curso" name="inicio-de-curso" placeholder="" style="width: 16em" value="" />
        </div>
        <div class="campo">
                <label for="funcao">Fun&ccedil;&atilde;o<abbr class="req" title="required"></abbr></label>
                    <input type="text" id="termino-de-curso" name="termino-de-curso" placeholder="" style="width: 16em" value="" />
        </div>
        <div class="campo">
                <label for="atividades">Principais atividades desenvolvidas<abbr class="req" title="required"></abbr></label>
                    <textarea cols="81em" rows="3"></textarea>
        </div>
        <div class=campo>
            <label for="data-de-admissao">Data de Admiss&atilde;o<abbr class="req" title="required"></abbr></label>
                <input type="date" name="datadenascimento"  style="width: 10em"value="">
        </div> 
        <div class=campo>
            <label for="data-de-demissao">Data de Demiss&atilde;o<abbr class="req" title="required"></abbr></label>
                <input type="date" name="datadenascimento"  style="width: 10em"value="">
                <input type="checkbox" name="opções" value="php"/> Este &eacute; o meu atual emprego
        </div>
        <div class="campo">
                <label for="motivo">Motivo da sa&iacute;da<abbr class="req" title="required"></abbr></label>
                    <textarea cols="137" rows="1" ></textarea>
        </div>
        </fieldset>
    <h3>INFORMA&Ccedil;&Otilde;ES ADICIONAIS</h3>
    <hr width=20% size=3px color=#1e90ff>
	<link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
	<style type="text/css">
	
h3 {
   font-family: "Roboto", sans-serif;
   font-size: 15px;
   font-weight:bold;
    color: black;
    background-color: #ffffff}
   </style>  
   <fieldset class="grupo">
        <div class="campo">
                <label for="positivo">Pontos positivos / qualidades<abbr class="req" title="required"></abbr></label>
                    <textarea cols="137" rows="1" required="required"></textarea>
        </div>
        <div class="campo">
                <label for="negativo">Pontos negativos / defeitos<abbr class="req" title="required"></abbr></label>
                    <textarea cols="137" rows="1" required="required"></textarea>
        </div>
        <div class="campo">
                <label for="objetivo">Objetivos profissionais<abbr class="req" title="required"></abbr></label>
                    <textarea cols="137" rows="1" required="required"></textarea>
        </div>
        <div class="campo">
                <label for="resumo">Em um pequeno texto de 10 a 15 linha, fa&ccedil;a um relato sobre voc&ecirc;<abbr class="req" title="required"></abbr></label>
                    <textarea cols="137" rows="15" required="required"></textarea>
        </div>
    </fieldset>
 <input type="submit" class="submit" name="botao_enviar" value="Enviar Dados"/>
 </form>
	</body>
</html>

Felipe Paz · 15 de setembro de 2017

@André Da Silva Ventura , tudo bem? Na verdade teu código precisa ser melhorado em algumas partes. Primeiramente, remover todo o css dele e inserí-lo em um arquivo .css.

A chamada dele, caso não saiba, você vai fazer no head do teu html. Por exemplo

<head>
  <link rel="stylesheet" href="minhapasta/meuarquivo.css" />
</head>

Tem head dentro de head. Não pode. Todo a meta tag ou link de chamada deve ser feito dentro da head e não pode colocar divs lá dentro.

Após isso feito, surge a questão de inserção dos dados em um banco de dados. Aí entra o X da questão. Para isso, você vai precisar trabalhar com alguma linguagem de programação web: php, asp, jsf entre outros. Pegar esses dados e jogá-los no banco de dados seja puramente com a linguagem de programação escolhida, seja por ajax ( um método do javascript).

Enfim, com base no que tu escreveu, sugiro que primeiramente continue estudando html, css, como se trabalha com essas duas marcações e somente após isso aprenda uma linguagem de programação web para depois trabalhar com dados e manipulação dos mesmos.