caixas de entrada de texto HTML são utilizados em formas de coletar informações do usuário. Inerentemente incluem sombras com base no navegador que você usa. Safari, por exemplo, tem o foco azul em torno da caixa, quando focada na caixa. Usando CSS pode remover a sombra de caixas de texto de entrada e personalizá-los para caber o design do site em geral. Na maioria das vezes um desenvolvedor irá manter a sensação caixa, mas, ocasionalmente, um design gráfico será aplicada a uma caixa de texto. A tarefa, como a remoção de uma sombra de texto não deve sacrificar a funcionalidade do elemento de formulário, mas melhorá-lo.
Abra um editor de texto, como o Dreamweaver ou BBEdit (consulte Recursos) e criar um arquivo HTML. Insira um formulário HTML, incluindo pelo menos uma entrada com type ="texto". Crie um arquivo de folha de estilo e nomeá-la "main.css."
Crie uma classe CSS para caixas de texto de entrada. Dê-lhe um nome que está perto do que ele irá estilo, como "caixas de texto." Este nome da classe residirá em seu arquivo de folha de estilo e vai realizar a definição de estilo para as suas caixas de texto.
Defina os atributos de sua classe CSS. Aqui estão exemplos de atributos específicos que possa ter de definir:
border: 1px solid # 000000;
font-size: 14px;
color: # 333333;
padding: 5px 5px 5px 5px;
background: url ("images / myinputbox.jpg") 0 0 no-repeat;
width: 300px;
position: relative;
float: left;
Alterando o atributo fronteira é o mais importante para alterar qualquer atributo de entrada de texto. Isso é geralmente o que determina o sombreamento em torno de caixa de texto. Ajustar preenchimento permite determinar a quantidade de espaço (em pixels) a partir de dentro da caixa de texto. tamanho e cor da fonte permitem determinar o tamanho do texto da caixa de entrada e de cor. Adicionando um fundo permite que você personalize sua caixa de texto de entrada para seguir o design do seu site.
Adicione a classe que você criou a qualquer entrada de texto que deseja denominado. Siga este formato:
Use a mesma classe para cada caixa de entrada de texto para que o mesmo estilo vai ser aplicadas igualmente em todas as caixas de texto de entrada.
Insira seu arquivo de folha de estilo em seu arquivo HTML dentro do
tag. Siga este formato:Abra o arquivo HTML em um navegador da web e visualizar a caixa de entrada (es) que você criou. Revisar arquivo de folha de estilo como necessário para atingir aparência desejada.