Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Annye Tessaro

CSS X Imagem X Menu

Recommended Posts

Olá Pessoal,

è minha primeira participação no fórum. Ainda não sei muito de CSS (na verdade quase nada), mas tô estudando e aprendendo. E nada melhor do que colocando de fato a mão na massa, né?

E acabei me deparando com algumas dúvidas. Fiz várias pesquisas mas nãoi achei a solução. Estou apelando para vcs. Alguém poderia me dar uma mãozinha??? http://forum.imasters.com.br/public/style_emoticons/default/blush.gif

Eu quero colocar uma imagem que vai ficar por baixo de um texto. Este texto tem um espaço determinado (no caso, se tiver mais texto, entra a barra de rolagem). A imagem não cobre todo o texto, e sim algo em torno de 15% no máximo. Eu quero que a imagem fique no canto inferior direito. Já testei todas as posições e não fica. Se eu aumento a margem ou o padding, aumenta no texto, mas não quero mexer na posição do texto, só da imagem. Alguém tem idéia de como arrumar isso??

E se não for pedir muito, e alguém tiver a paciência de me explicar sobre o menu...

Fiz um menu na página index. Funcionou tudo belezinha. Para aproveitar as informações, códigos, etc, salvei este index com outro nome e os links do menu deixaram de funcionar!?!?! Não alterei nada no arquivo, nenhuma vírgula. Alguém saberia me dizer pq ele não funciona mais? Eu tenho que fazer um código CSS para cada página? Não posso usar o mesmo para todas as páginas já que a posição e links são os mesmos??

 

Acho que foi muito para a primeira vez né...

Tentarei ajudar tbém, quando for mais craque, pq neste momento tô cheia de interrogação.

 

Brigadão. http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Falaí cara, seja bem vindo e parabéns por entrar no mundo webstandard!!

 

Sempre que você puder poste um link para gente poder te ajudar e resolver seu problema com mais rapidez ok?

 

Qto à imagem que você falou, tente colocá-la como imagem de fundo da div do texto, e então posicione-a no canto inferior direito, algo assim:

 

div{	background: url(imagem.jpg) no-repeat bottom right}

Isso faz com que a imagem fique no fundo da div, não se repita e se alinhe na parte de baixo e na direita.

 

 

qto aos links, pode ter acontecido caso tenha salvo o arquivo em uma pasta separada, ou algo do genero.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Opa... Puxa, acho que realmente encontrei o lugar certo. Já tava cansada de sempre escrever as mesmas dúvidas e nunca aparecer um anjo que me desse uma luz. Valeu mesmo TheChessMan e pa_bruno. Espero aprender bastante para poder ajudar um monte de gente aqui tbém. :D Vou testar a imagem e logo respondo.Mas então Chess, os menus acho que foi isso mesmo, eu salvei eu uma página diferente. Eu fiz uma pasta para cada link, vamos dizer assim, para ficar mais organizado. O Indez não tá em pasta nenhuma pq é geral. As páginas seguintes já vão cada uma dentro de suas respectivas páginas. Vou colocar código que eu fiz:**Menu do index**<div id="menu"><p align="right" class="menu"><a href="espaco luaram/espaco.htm">Espaço Luaram</a></p><p align="right" class="menu"><a href="equipe/equipe.htm">Nossa equipe</a></p><p align="right" class="menu"><a href="atividades/atividade.htm">Atividades</a></p><p align="right" class="menu"><a href="horarios/horario.htm">Horários</a></p><p align="right" class="menu"><a href="artigos/artigos.htm">Artigos</a></p><p align="right" class="menu"><a href="cursos/cursos.htm">Cursos</a></p><p align="right" class="menu"><a href="eventos/eventos.htm">Eventos</a></p><p align="right" class="menu"><a href="mapa%20do%20site/mapa_site.htm">Mapa do site</a></p><p align="right" class="menu"><a href="fale%20conosco/fale.htm">Fale conosco</a></p><p align="right" class="menu"><a href="livro%20de%20visitas/visitas.htm">Livro de visitas</a></p></div>**Menu da página espaço**<div id="menu"><p align="right" class="menu"><a href="espaco.htm">Espaço Luaram</a></p><p align="right" class="menu"><a href="../equipe/equipe.htm">Nossa equipe</a></p><p align="right" class="menu"><a href="../atividades/atividade.htm">Atividades</a></p><p align="right" class="menu"><a href="../horarios/horario.htm">Horários</a></p><p align="right" class="menu"><a href="../artigos/artigos.htm">Artigos</a></p><p align="right" class="menu"><a href="../cursos/cursos.htm">Cursos</a></p><p align="right" class="menu"><a href="../eventos/eventos.htm">Eventos</a></p><p align="right" class="menu"><a href="../mapa%20do%20site/mapa_site.htm">Mapa do site</a></p><p align="right" class="menu"><a href="../fale%20conosco/fale.htm">Fale conosco</a></p><p align="right" class="menu"><a href="../livro%20de%20visitas/visitas.htm">Livro de visitas</a></p></div>** CSS Menu**#menu{ width: 147px; height:auto; font:"Arial Black"; font-size:16px; margin-top:20px; position: absolute; padding-right:22px; background-position:center; background-image: url(imagens/fundo%20menu_esq.jpg);.menu { font-family:"Arial Black";font-size:14px;}.menu a {display: block;color: #000000;text-decoration: none;}.menu a:link { color:#000000; text-decoration: none;}.menu a:visited { color:#000000; text-decoration: none;}.menu a:hover { text-decoration: none;color:#FFCC00; }.menu a:active { text-decoration: none;color: #FFCC00; }Era isso ??

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.