Como configurar o botão buscar
Bom dia, boa tarde, boa noite :) eu to finalizando meu primeiro site em html e css, mas ainda falta configurar o botão buscar do site para fazer as pesquisas e ainda não seu como fazer.
Se alguém souber me ajudar agradeço.
Se alguém souber me ajudar agradeço.
Juliana
Curtidas 0
Respostas
William
31/07/2015
Olá Juliana, por gentileza poste seu código para entendermos o que você já tem pronto!
GOSTEI 0
Juliana
31/07/2015
Bom dia, boa tarde, boa noite :) eu to finalizando meu primeiro site em html e css, mas ainda falta configurar o botão buscar do site para fazer as pesquisas e ainda não seu como fazer.
Se alguém souber me ajudar agradeço.
Se alguém souber me ajudar agradeço.
html da home:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Storm Tech - Criação de Sites</title>
<link rel="stylesheet" type="text/css" href="css/estilo.css">
<link href='http://fonts.googleapis.com/css?family=Roboto:400,700,100' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/css?family=Dancing+Script:400,700' rel='stylesheet' type='text/css'>
</head>
<body>
<div class="cabecalho">
<div class="linha">
<header>
<div class="coluna col4">
<img src="img/logo.png" alt="logo Storm Tech" title="logo Storm Tech">
</div>
<div class="coluna col4">
<h2 class="titulo-texto titulo-home">Criação de Sites</h2>
</div>
<div class="coluna col4">
<form action="" class="buscar">
<input type="text" class="text-busca" placeholder="Buscar..."/>
<input type="image" class="img-busca" src="img/img.busca.png"/>
</form>
</div>
</header>
</div>
</div>
<div class="menu">
<div class="linha">
<nav>
<div class="coluna col12">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="como-e-feito-o-site.html">Como é feito o site</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</div>
</nav>
</div>
</div>
<div id="baner">
<div class="linha">
<div class="coluna col3" id="img1-baner">
<img src="img/img1-baner.png" alt="">
</div>
<div class="coluna col3">
<p class="texto"><h3 class="titulo-texto">Sites Para Pequenos Negócios</h3><br>Sites Para Pequenos NegóciosLorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa.</p>
</div>
<div class="coluna col3" id="img2-baner">
<img src="img/img2-baner.png" alt="">
</div>
<div class="coluna col3">
<p class="texto"><h3 class="titulo-texto">Sites Para Divulgação</h3><br><br>Sites Para DivulgaçãoLorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis,massa gkhfk siutnhhdf <br><br></p>
</div>
</div>
</div>
<div class="conteudo">
<div class="linha">
<div class="coluna col12">
<h3 class="titulo-texto">As Melhores Ferramentas Para o Seu Site</h3>
</div>
</div>
<div class="linha">
<div class="coluna col12">
<img class="setas" src="img/seta1.png" alt="">
<img class="setas" src="img/seta2.png" alt="">
<img class="setas" src="img/seta3.png" alt="">
</div>
</div>
<div class="linha">
<div class="coluna col4 img-html-css3-fireworks">
<img src="img/box-conteudo1.png" alt="HTML5">
</div>
<div class="coluna col4 img-html-css3-fireworks">
<img src="img/box-conteudo2.png" alt="CSS3">
</div>
<div class="coluna col4 img-html-css3-fireworks">
<img src="img/box-conteudo3.png" alt="FireWorks">
</div>
</div>
</div>
<div class="rodape">
<footer>
<div class="linha">
<div class="coluna col12">
<h6>© Storm Tech - Criação de Sites 2015</h6>
</div>
</div>
</footer>
</div>
</body>
</html>css do site:
/* grid de 1200px*/
*{
margin: 0;
padding: 0;
}
body{
overflow-x: hidden;
}
.linha{
width: 1200px;
margin: 0 auto;
overflow: auto;
padding: 5px 0;
}
.coluna{
padding: 0 10px;
float: left;
}
.col1{
width: 80px;
}
.col2{
width: 180px;
}
.col3{
width: 280px;
}
.col4{
width: 380px;
}
.col5{
width: 480px;
}
.col6{
width: 580px;
}
.col7{
width: 680px;
}
.col8{
width: 780px;
}
.col9{
width: 880px;
}
.col10{
width: 980px;
}
.col11{
width: 1080px;
}
.col12{
width: 1180px;
}
.cabecalho{
background: #dee3e6;
width: 100%;
}
.titulo-home{
font-size: 30pt !important;
margin-top: 20px;
}
.text-busca{
background:#BBBBBB;
font-style:italic;
font-size:18px;
border: 1px solid rgb(51,51,51,05);
height:30px;
width:210px;
color:#555555;
margin-top: 15px;
border-radius: 10px;
}
.img-busca{
width: 38px;
height: 30px;
}
.buscar{
float: right;
margin-top: 20px;
}
.menu{
width: 870px;
height: 50px;
background: #CFBFFF;
margin:-25px 230px 0 230px;
border-radius: 20px;
}
.menu ul{
margin: 10px 0 10px 250px;
}
.menu ul li{
display:inline;
padding-right: 50px;
}
.menu ul li a:link, a:active, a:visited{
text-decoration: none;
color: #30003F;
font-size: 14pt;
}
.menu ul li a:hover{
text-decoration: underline;
color: #006CD8;
}
#baner{
width: 100%;
height: 260px;
background: #dee3e6;
margin-top: 30px;
}
#baner .linha .col3{
margin-top: 22px;
}
#img1-baner{
width: 312px;
height: 205px;
}
#img2-baner{
width: 237px;
height: 205px;
}
#baner .col3 p{
border: 1px dotted black;
margin-top: 0px;
}
.conteudo{
border-right: 1px solid rgba(0,0,0,0.5);
border-left: 1px solid rgba(0,0,0,0.5);
width: 1080px;
margin: 0 auto;
}
.conteudo .col12 h3{
margin: 30px 90px 0 0px;
}
.setas{
padding-right: 150px;
margin: 20px 0 0 150px;
}
.img-html-css3-fireworks{
width: 282px;
padding-right: 30px;
margin: 0 0 30px 32px;
}
.rodape{
background: #777777;
width: 100%;
height: 60px;
}
.rodape .col12 h6{
text-align: center;
font-size: 10pt;
color: #30003F;
font-family: 'Cabin',arial;
margin-top: 20px;
}
/* estilo dos textos */
.texto{
font-size: 15pt;
}
.largura-texto{
max-width: 1060px;
}
.img-texto-direita{
float:right;
margin: 20px 10px 10px 20px;
}
.titulo-texto{
text-align: center;
font-size: 22pt;
font-family: 'Dancing Script', arial;
font-weight: 700;
text-shadow: 2px -2px 5px #9672FF;
}
.subtitulo-texto{
font-size: 20pt;
font-family: 'Dancing Script', arial;
font-weight: 400;
text-shadow: 2px -2px 5px #9672FF;
}
/* fim estilo dos textos */GOSTEI 0
Randrade
31/07/2015
Olá Juliana,
Somente com essas informações não é possível lhe ajudar. Você está usando alguma linguagem para fazer a busca no banco de dados? Se sim, qual?
Qual o banco de dados e a estrutura que você está usando?
Somente com essas informações não é possível lhe ajudar. Você está usando alguma linguagem para fazer a busca no banco de dados? Se sim, qual?
Qual o banco de dados e a estrutura que você está usando?
GOSTEI 0
Juliana
31/07/2015
Olá Juliana,
Somente com essas informações não é possível lhe ajudar. Você está usando alguma linguagem para fazer a busca no banco de dados? Se sim, qual?
Qual o banco de dados e a estrutura que você está usando?[/quote
Ae é que ta, eu nao to usando nenhuma limguagem de tratamento de dados e queria saber como fazer isso, como configurar o botao para exibir as pesquisas, provavelmente deve usar php né , andei vendo umas aulas ae mas nao sei ainda como tratar esses dados .
Somente com essas informações não é possível lhe ajudar. Você está usando alguma linguagem para fazer a busca no banco de dados? Se sim, qual?
Qual o banco de dados e a estrutura que você está usando?[/quote
Ae é que ta, eu nao to usando nenhuma limguagem de tratamento de dados e queria saber como fazer isso, como configurar o botao para exibir as pesquisas, provavelmente deve usar php né , andei vendo umas aulas ae mas nao sei ainda como tratar esses dados .
GOSTEI 0