• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

Sir Pereira

Texto por cima de imagem

22 mensagens neste tópico

Boas pessoal,

eu sinceramente sabia fazer isto, mas já nem me lembro.

É o seguinte, tenho o seguinte código:

<td colspan="4" align="center">$rubricpic<div style="float;"><span class="Stil4">&#8226; $headline</span></div></td>

Como podem ver: www.ggmultigaming.com

Mas, agora queria pôr o texto por cima aliás, ao meio da imagem ali das notícias, onde diz Event News, e sem aquele background atrás do texto.

Abraço :(

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Basicamente o que eu acho que queres fazer é o seguinte: tens dois divs distintos, o da imagem e o do texto. O que podes fazer é (acho que assim resulta):

<div id="imagem"> <img src="..." alt="..."  /> </div>
<div id="texto"> blablabla </div>

#imagem {
   padding: X1px X2px X3px X4px;
   margin:  Y1px Y2px Y3px Y4px;
}

#texto {
   position: absolute;
   padding: Z1px Z2px Z3px Z4px;
   margin:  Y1px Y2px Y3px Y4px;
}

Não sei se em #imagem terás de acrescentar um float: left; Mas experimenta

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não o consegui pôr no meio :/ como eu tenho agora, já foi de algumas alterações que fiz ...

PS: Pus como ficou com o teu código para veres como ficou. Isto já com o float:left; incluído, pois se não tivesse o float, o texto aparecia em baixo da imagem.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Sir Pereira, porque usas a tag img em vez de colocares a imagem no background da div?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Sir Pereira, porque usas a tag img em vez de colocares a imagem no background da div?

Eu não uso a imagem, simplesmente estou a usar uma variável que vai buscar a tag img.

E se eu mudar o valor da variável a tabela vai aparecer-me toda desconfigurada ou nem aparece.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Sir Pereira,

tenta isto no template :

$pattern = '#src=["|\'](.*?[^"\'])["|\']#i';
preg_match_all($pattern, $rubricpic_path, $parts, PREG_SET_ORDER);

$parts[1]; // resultado

Em principio dar-te-a o link da imagem da variável, sem teres de ir alterar o sistema.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Mas tipo, eu consigo obter esse link, mas está numa variável, e se eu puser por exemplo <div background='.$imagemfundo.'>

ele simplesmente não me vai retornar nada.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Óbvio que não, isso não existe :)

echo '<div style="background-image: url('.$link.')"></div>';

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Óbvio que não, isso não existe :D

echo '<div style="background-image: url('.$link.')"></div>';

Desculpa, mas neste caso aí enganas-te :)

Porque isto é um ficheiro html, não intercepta PHP, apenas consegue interceptar as variáveis :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Desculpa, mas neste caso aí enganas-te :D

Porque isto é um ficheiro html, não intercepta PHP, apenas consegue interceptar as variáveis :)

Então é renderizado o html pelo php? Se assim o for, mete o código que dei no php ..

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Então é renderizado o html pelo php? Se assim o for, mete o código que dei no php ..

Desculpa não percebi.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Desculpa não percebi.

Se o template tem a extensão html, então é o php que está a controlá-lo, certo?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se o template tem a extensão html, então é o php que está a controlá-lo, certo?

Provavelmente, mas qualquer outro código php não funciona.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Provavelmente, mas qualquer outro código php não funciona.

Como é que não funciona? Isso é um bocado esquisito ..

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Como é que não funciona? Isso é um bocado esquisito ..

Pois não sei, se quiseres dou-te os dados do servidor, para se quiseres fazer algum teste :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois não sei, se quiseres dou-te os dados do servidor, para se quiseres fazer algum teste :)

Não tenho tempo agora, mas já mexi com essa plataforma e não me lembro dessas nuances.

Tem de haver uma maneira de o fazer :D

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não houve porque todos os outros templates não precisam de um sistema de fixação de background pela própria div, fazem-no mesmo por imagem :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

De uma forma muito resumida, o que o sistema faz é isto:

$vars = array('$ois', '$headline');
$valores = array("OIS!", "PAP RULZ!");
echo str_replace($vars, $valores, file_get_contents("template.html"));

Ou seja, em vez de estares a usar <td background="$url">, que é algo não recomendado (google responde-te o porquê facilmente), usas <td style="background-image:url('$url')">.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

De uma forma muito resumida, o que o sistema faz é isto:

$vars = array('$ois', '$headline');
$valores = array("OIS!", "PAP RULZ!");
echo str_replace($vars, $valores, file_get_contents("template.html"));

Ou seja, em vez de estares a usar <td background="$url">, que é algo não recomendado (google responde-te o porquê facilmente), usas <td style="background-image:url('$url')">.

Wooow  :eek:

Funcionou :D

desta é que eu não estava à espera, pensei mesmo que não conseguia resolver o endereço da imagem para o background, quer dizer e para a propriedade background do td não conseguia, mas assim resultou :)

Está perfeito agora :)

Abraço e obrigado a todos :D

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Wooow  :eek:

Funcionou :D

desta é que eu não estava à espera, pensei mesmo que não conseguia resolver o endereço da imagem para o background, quer dizer e para a propriedade background do td não conseguia, mas assim resultou :)

Está perfeito agora :)

Abraço e obrigado a todos :D

Se esse funcionou, a solução que dei também tinha de funcionar, a menos que não desses mais nenhum estilo à div ... :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois não sei :)

Já agora, sabem como pôr por exemplo para o texto separar em duas linhas se estiver muito comprido?

(se quiserem ver ao que me estou a referir, vejam agora o título da primeira notícia no site)

:D

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Metes o container do texto com um max-width e a cada x caracteres seguidos numa palavra, metes um espaço.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora