Borda No Texto..

#1 Douglas

Super Veterano

Usuários
1829 posts

Sexo:Não informado

Posted 23/01/2006, 19:08

ae galera.. procurei e não achei..

quero fazer isso:
http://www.maujor.co...al/eftext3.html

mas sem fundo, borda preta e texto branco.. msm lendo eu não consegui fazer..

alguem da um help ae, fazendo favor?

~~quer meu msn?~~
não, não quer!

quer tirar duvidas no msn?
problema seu, aqui é um forum!

#2 Alex Hiroshi

Super Veterano

Ex-Admins
4923 posts

Sexo:Masculino
Localidade:São Paulo - SP

Posted 23/01/2006, 21:47

Você pode tirar essa linha

div.tudo {position:relative; background:#999; width:37em; height:5em;}

ai é a configuração da caixa que o texto fica...
Para mudar a cor do texto é nessa linha (só tem ela)

color:#f00;

esse #f00 é o vermelho, pode mudar para outra cor..
Para mudar a borda (branca).. mude essa linha (tem 4 dela no código)

color:#fff;

#fff é o branco

O css é simples, tem o tutorial dele tbm ou você está olhando só no código fonte?

Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador

#3 Douglas

Super Veterano

Usuários
1829 posts

Sexo:Não informado

Posted 24/01/2006, 20:31

saca só..

<html>
<head>
<title>Teste</title>
	

<style type="text/css">
body
div.texto, div.efeito1, div.efeito2, 
div.efeito3, div.efeito4  { 
	font: 300px "Arial black", Helvetica, sans-serif; 
	}
div.texto {  
	position:absolute; 
	top:0; 
	left:0;
	color:#FFFFFF; 
	}
div.efeito1 { 
	position:absolute;
	left: 1px;
	top: -1px;
	color:#000000; 
	}
div.efeito2 { 
	position:absolute;
	left: -1px;
	top: 1px;
	color:#000000; 
	}
div.efeito3 { 
	position:absolute;
	left: -1px;
	top: -1px;
	color:#000000; 
	}
div.efeito4 { 
	position:absolute;
	left: 1px;
	top: 1px;
	color:#000000; 
	}
</style>


</head>
<body bgproperties="fixed" background="file://C|/WINDOWS/Desktop/layout dd/images/caixa_de_texto.jpg">



<div class="tudo">
<div class="efeito4">Douglas</div>
<div class="efeito3">Douglas</div>
<div class="efeito2">Douglas</div>
<div class="efeito1">Douglas</div>
<div class="texto">Douglas</div>
</div>



</body>
</html>

ve ai como ficou.. coloca a fonte em 300px, só pra ver de perto a borda.. ta mó zuada.. qq eu faço pra melhorar a qualidade dela?

~~quer meu msn?~~
não, não quer!

quer tirar duvidas no msn?
problema seu, aqui é um forum!

#4 arthurlucena

Imamade nandomo..

Usuários
343 posts

Sexo:Masculino
Localidade:João Pessoa
Interesses:Desenho, artes gráficas, fotografia, games, praia, cinema, animes, cultura japonesa, tecnologia, desenvolvimento para web entre outras coisas =)

Posted 28/01/2006, 20:33

Hmm.. Douglas veja bem:

Não há como ficar melhor que isso. Essa "zuada" seria chamado de "artefato" ou "serrilhado". Se você for no paint do windows xp e escrever seu nome com tamanho 300px verá que isso não vai aparecer, por que? Porque o paint e os demais programas gráficos possui um "efeito" chamado "anti-aliasing" que elimina esse aspecto pixelizado nos vetores e textos. O fato de algumas partes da borda estar mais grossa que outras é devido ao código que você usou: perceba que usou 4 camadas para o mesmo texto, uma camada está um pixel acima, outra um pixel abaixo, um pixel à esquerda e um pixel a direita. Dessa forma esse efeito fica muito susceptível à esse tipo de resultado para letras e fontes muito arredondadas. Para uma melhor qualidade só uma imagem mesmo.

...........darkness.........²d¬¬b²
A vida é muito curta para se preocupar com o que as outras pessoas pensam. Viva.
Arthur Lucena..................貴族
arthurlucena at email dot com
[O'']olhares.com/arthurlucena

#1 Douglas

#2 Alex Hiroshi

#3 Douglas

#4 arthurlucena

1 user(s) are reading this topic

Entrar