Sending of HTML Form

Asked

Viewed 37 times

0

Hello good afternoon I’m having doubts about how to send the information in my form to an email , someone could help me indicate something I can do , thanks !! Hugs

Below is an image of how this forms the CSS and HTML code. Formulário

#topo {
	background:url(../imagens/topo2etrelas2.png);
	border-left:1px solid #000;
	border-right:1px solid #000; 
	position:inherit;
	width:1024px;
	height:190px;
	margin:auto;
	

}

#fundoinicial {
	background: #FFF;
	width: 1024px;
	height: 500px;
	margin: auto;
	position:relative;
	border-right: 1px solid #000;
	border-left: 1px solid #000;
	
}


#menufundo {
	background:#60365e;
	border:1px solid #000;
	position:relative;
	width:1024px;
	height:28px;
	margin:auto;
		
}


#ul li a{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-style:normal;
	list-style-type:none;
	display: inline;
	font-size:19px;
	line-height:0px;
	padding:10px;
    margin:4px 0 0 52px;
	color:#FFF;
	text-decoration:none;
	float:left;
	
	
}

#ul li a:hover{
	text-shadow:0px 0px 0px black,
				0px 0px 0px black,
				0px 0px 0px black,
				0px 0px 0px black;	
	font-size:19px;
    color:black;
}


.rodape {
	background: url(../imagens/rodape.png);
	width: 1056px;
	height: 99px;
	position:absolute;
	left:-3%;
	top:95%;

	
	
}
.local a{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 19px;
	color: #FFF;
	text-decoration: none;
	text-shadow: 1px 1px black;
	position:absolute;
	top: 9%;
	left: 4%;
	display:block;
	
}
	

.mapa1 a{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #FFF;
	text-decoration: none;
	text-shadow: 1px 1px black;
	position:absolute;
	left: 4%;
	top: 45%;
	display:block;
}

.facebook img{
	width: 32px;
	right: 32px;
	position:relative;
	top: 25px;
	left: 515px;
	opacity: 0.5;
	filter: alpha(opacity=50);
	
}

.facebook:hover {
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

.trabalhe h2{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 19px;
	color: #FFF;
	text-decoration: none;
	text-shadow: 1px 1px black;
	position: absolute;
	left: 842px;
	top: 15px;
	width: 159px;

}

.email1 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #FFF;
	text-decoration: none;
	text-shadow: 1px 1px black;
	position:absolute;
	top: 35%;
	left:80%;
}

body {
    padding: 0;
    margin: 0;
}

form {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: 25px;
	background-color:transparent;
    max-width: 500px;
	position:absolute;
	top:10%;
	left:4%;
	
	
}

h1 {
    margin-bottom: 20px;
    margin-left: 9px;
    color:#000;
	
    
}

input, textarea {
    width: 200px;
    padding: 10px;
    color: black;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: 1px solid;
	border-color:#CCC;
	margin:7px;
}

input:hover, textarea:hover, input:focus, textarea:focus {
    border-color:#000;
    color: black;
    font-weight: bold;
}

.submit input {
    height: 40px;
    width: 100px;
    font-weight: bold;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: 1px solid;
	border-color:#CCC;
	background-color:#FFF;


}

.submit input:hover {
	border-color:#000;
    color: black;
}

textarea {
    width: 400px;
    height: 120px;
    line-height: 20px;
    max-width: 400px;
}

.whatsapp {
	position:absolute;
	right:48%;
	top:55%;
}

.outlook {
	position:absolute;
	right:48%;
	top:68%;
}

.numero {
	position:absolute;
	top:50.5%;
	right:20%;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	width:200px;
	height:50px;
}

.ig {
	position:absolute;
	top:62.5%;
	right:11%;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	width:300px;
	height:50px;
}

.ligue {
	position:absolute;
	top:78%;
	right:15%;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	width:300px;
	height:50px;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Alfatec</title>
<link rel="shortcut icon" href="imagens/ico.png" type="imagem/x-png" />
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link  href="css/estilofale.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="jquery/jquery.mask.min.js"/></script>
<style type="text/css">
body {
	background-image: url(imagens/projeto/imagens/fundo.jpg);
}
</style>

<script>
function Enviar() {

    var nome = document.getElementById("nomeid") ;

    if (nome.value != "") 
	
	 {
        alert('Obrigado(a)  ' + nome.value +' os seus dados foram encaminhados com sucesso');
    }

}
</script>
</head>

<body>


<div id="topo"></div><!--div final topo-->
<div id="menufundo">

<nav id="ul">	  	
       			<ul>            
        			<li><a href="index.html" title="Página Inicial">Página Inicial</a></li> 
        			<li><a href="quem_somos.html" title="Quem Somos">Quem Somos</a></li>
        			<li><a href="cobertura.html" title="Áreas de Cobertura">Áreas de Cobertura</a></li> 
        			<li><a href="servicos.html" title="Serviços">Serviços</a></li>
        			<li><a href="fale_conosco.html" title="Fale Conosco">Fale Conosco</a></li>
    			</ul>
</nav>
</div>

        	
<div id ="fundoinicial">


				<div class="whatsapp">
                <img src="imagens/whatsapp-logo.png" />
                </div>
                
                <div class="outlook">
                <img src="imagens/icon.png" />
                </div>
                
                <div class="numero">
                <p class="numero" >94032-2448
                </p>
                </div>
                
                <div class="ig" >
                <p class="ig" >[email protected]</p>
                </div>
                
                <div class="ligue" >
                <p class="ligue" > Ou Ligue para 0800 580 2330</p>
                </div>

            <form name="meu_form" method="post" action="receba.php">
            
                    <h1>Entre em contato</h1>
            
                    <p class="nome">
                        <input type="text" id="nomeid" placeholder="Nome Completo"  required="required" name="nome" />
                    </p>
                    
                    <p class="fone">
  						<input type="tel" name="txttelefone" id="txttelefone" pattern="\([0-9]{2}\)[\s][0-9]{4}-[0-9]{4,5}"  	 				 						placeholder="Telefone" required="required" />
						<script type="text/javascript">$("#txttelefone").mask("(00) 0000-00009");</script>          
                    </p>
                    
                    <p class="email">
                       <input type="email"  id="email" value="" name="email" required="required" placeholder="Digite Seu E-mail"/>
                    </p>
                    
                    <p>
                       <textarea placeholder="Deixe sua Mensagem" required="required" name="mensagem"></textarea>
                    </p>
                    
                    <p class="submit">
                        <input type="submit" onclick="Enviar();" value="Enviar" />
                    </p>
            
            </form>

                                
	<div class="rodape">

				<div class="facebook"><a href="https://www.facebook.com/Alfatec-Autorizada-Electrolux-1737242946511224/" title=				 					"Facebook" target="_blank"><img src="imagens/facebook-logo (2).png" alt="FaceBook" width="42" class="facebook" 					/></a>
                </div>


				<div class="local">
					<a class="local" " target="_blank" title="Abrir Mapa">Localização</a>
				</div>


				<div class="mapa1">
					<a href=
target="_blank" title="Abrir Mapa">R. Profᵃ José Azevedo Minhoto,  		 					206<br/>
					Osasco - SP, 06080-125</a>
				</div>

				<div class="trabalhe" > 
						<h2>Trabalhe Conosco</h2>
				</div>

				<div class="email1" > 
						<p>[email protected]</p>
				</div>
    
    
	            
</div>




</body>
</html>

html form

  • Is using some language server-side?

  • No, I have a free test-only host

  • In the following passage: <form name="meu_form" method="post" action="receba.php"> , you are pointing your form to the file receba.php. What you programmed in this file?

  • This "receive.php" file is blank , why I’m not sure how to send the information on my form

No answers

Browser other questions tagged html form

You are not signed in. Login or sign up in order to post.