How to do CSS and HTML search field

Navigation
0

Hello, good afternoon, I would like to ask you some questions. I'm starting to learn now, I'm having a problem creating a search field on my site, I'd like some help.

I would like to put this search system

At the top of my site would be this

I'm a beginner in the area who could help me thank you very much !!!

CSS Code: 

@charset "utf-8";
/* CSS Document */

body {
font-family:Calibri;
font-size:30px;
line-height:36px;
color:rgb(255,255,255);
text-align:left;
}

#topo {
	background:url(../imagens/topo.png);	
	width:1024px;
	height:190px;
	border-bottom:none;
	margin:auto;
	
}

.logo {
	float:left;
	background:url(../imagens/logoc.png);
	width:541px;
	height:133px;
	position:relative;
	margin:40px 0 0 -4px;

}

Código HTML Abaixo
<title>Untitled Document</title>
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
</head>


<body>
<div id ="topo">
<div = class="logo"></div>
</body>
</html>

Thank you for the attention !!! Hugs

    
asked by anonymous 19.05.2017 / 17:24

1 answer

0
<form action="">
    <input class="Busca-texto" type="text"> //Campo de busca
</form>

<style>
    .Busca-texto{
        width: 200px; //Largura do campo
        height: 35px; //Altura do campo
        float: right; //Posição do campo
        background-image: url('img/ic_search_white_24dp_1x.png'); //diretório e imagem do icone 
        background-position: left;  //posição do icone
        background-repeat: no-repeat; //Não repetir o icone <- COLOCA ISSO PELO AMOR DE ODIN
        background-color: #fff; //Cor do fundo do campo
        border: 2px solid #000; //Cor da borda do campo
        border-radius: 4px; //Curvatura da borda nas "quinas"
        text-indent: 25px; //Um espaçamento para n atrapalhar a img
    }
</style>
    
19.05.2017 / 18:39
Disable forms autocomplete java.lang.RuntimeException: Parcel: unable to marshal value