Terça-feira, 12-09-2006 # 15:54 Css, Tutoriais

218 palavras

É muito mais fácil e prático fazer as bordas das suas imagens com css, assim você não precisa editar a foto apenas para colocar a borda. Veja o exemplo:

Sem borda:

Com borda:

01. Coloque o seguinte código no seu css:

.borderimage{
background-color: #ffffff;
padding: 7px;
border: 1px solid #dbdbdb;
margin-right: 4px;
margin-left: 4px;
margin-top: 1px;}

Para colocar uma imagem como background da borda, substitua background-color: #ffffff; por background-image: url (http://www.imagem.com.br); e coloque o endereço da imagem que quer usar.
02. E onde você quer que a imagem apareça com borda coloque:

03. Se quiser que o fundo da sua borda tenha uma imagem, substitua background-color: #ffffff; por background-image: url(http://www.imagem.com);
04. Para que a borda funcione corretamente no internet explorer, você tem que substituir

<html>

Por

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">