Jump to content

  2. →
  3. →
  4. →

Photo

Efeito Se Sombra Na Tabela

Started By Luis Otávio, 31/12/2004, 21:22

  • Faça o login para participar
23 replies to this topic

#1 Luis Otávio

Luis Otávio

    Super Veterano

  • Usuários
  • 3113 posts
  • Sexo:Masculino
  • Localidade:Porto Alegre
  • Interesses:- Desenvolvimento de aplicações Web com linguagem server-side PHP.

    - Desenvolvimento de aplicações Web com linguagem cliente-side JavaScript, conhecedor e utilizador da biblioteca jQUERY e todas suas características.

    - Otimização de Desempenho aplicados a performance de banco de dados Mysql.

    - Otimização de Desempenho para servidores Web utilizando-se como Webserver NGINX em conjunto com Varnish.

    - Sólidos conhecimentos no CMS WordPress para novas implementações, manutenção, criação e otimização de Plugins.

    - Práticas de atendimento, relacionamento e suporte ao cliente. Trabalhando voltado ao público desde o lançamento da empresa iPORTO.COM, criando laços e vínculos com os mais de Mil clientes da empresa e os braços do grupo.

Posted 31/12/2004, 21:22

Opa, povo, alguem saberia me dizer como eu posso fazer este efeito de sombra na tabela... tipo, parece que ela ta sobrevoando a pagina, e fica uma sobra atras, que nem o site da MTV

http://mtv.terra.com.br/

num sei se é um efeito ou uma imagem vinda do css, alguem poderia me explicar como posso fazer isso?

;) (y)
* Otávio Nogueira
* Administração e Configuração de Servidores;
* Combinação Perfeita: NGINX + PHP + VARNISH + HAPROXY
* otavio*iporto.com ~ Tel: +55 51 3366 0177 | +55 51 4063 7343 |
* @iporto

#2 abc2

abc2

    Cuidado com o Narcisismo

  • Usuários
  • 546 posts
  • Sexo:Não informado
  • Localidade:Blumenau/SC

Posted 31/12/2004, 22:03

aquela barra ali do menu eh em flash...
ja no resto do site o pessoal usou os comandos onmouseout e onmouseover em cada uma das tabelas

<table width="95%" bgcolor="#E8E8E8" onmouseover="bgColor='#cccccc'" onmouseout="bgColor='#E8E8E8'">

nao sei se era isso q vc queria, mas acho que sim :)

agora deixa eu ir que o pessoal ja ta me chamando pra tomah champagne hehehehe

#3 Alex Hiroshi

Alex Hiroshi

    Super Veterano

  • Ex-Admins
  • 4923 posts
  • Sexo:Masculino
  • Localidade:São Paulo - SP

Posted 31/12/2004, 23:00

. . vc se referi aquela sombra que fica na pagina toda?
se for, é so usar imagens...
cria uma imagem com sombra, usa o css pra ela se repetir apenas na vertical ;)
Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador

#4 danillonunes

danillonunes

    Se tudo está funcionando bem, algo está errado, e vice-versa

  • Usuários
  • 182 posts
  • Sexo:Não informado
  • Localidade:Campinas - SP

Posted 31/12/2004, 23:26

Esse aqui é bem simples :P
<html>
<head>
<style>
.sombreada { background: black; margin: 3px 0 0 3px; width: 300px; }
.sombreada .tS { display: block; position: relative; top: -3px; left: -3px; background: #EEEEFF; }
</style>
</head>
<body>
<div class="sombreada"><span class="tS">
Texto...aaahhhhhhhhhhhhhhhh
</span></div>
</body>
</html>

Esse aqui é mais complexo ==> http://www.maujor.co...oundshadow.html

Edição feita por: danillonunes, 31/12/2004, 23:28.

Abraços
Marcus Danillo
http://danillonunes.net

#5 Luis Otávio

Luis Otávio

    Super Veterano

  • Usuários
  • 3113 posts
  • Sexo:Masculino
  • Localidade:Porto Alegre
  • Interesses:- Desenvolvimento de aplicações Web com linguagem server-side PHP.

    - Desenvolvimento de aplicações Web com linguagem cliente-side JavaScript, conhecedor e utilizador da biblioteca jQUERY e todas suas características.

    - Otimização de Desempenho aplicados a performance de banco de dados Mysql.

    - Otimização de Desempenho para servidores Web utilizando-se como Webserver NGINX em conjunto com Varnish.

    - Sólidos conhecimentos no CMS WordPress para novas implementações, manutenção, criação e otimização de Plugins.

    - Práticas de atendimento, relacionamento e suporte ao cliente. Trabalhando voltado ao público desde o lançamento da empresa iPORTO.COM, criando laços e vínculos com os mais de Mil clientes da empresa e os braços do grupo.

Posted 01/01/2005, 01:02

ai, acho que entendi, so que num sei fazer... hehe .. o q q ta errado neste meu codigo, por que a cor da borda do topo aparece, porem a imagem naum... :wacko: 

.TabelaEntrada {
BORDER-RIGHT: 2px solid #336666; BORDER-LEFT: 2px solid #336666; BORDER-BOTTOM: 7px solid #336666;  
BORDER-TOP: 2px solid #336666 background-image url("img/dobra_topo.gif");
      
}

eu to tentando colocar a imagem na maldita BORDER-TOP, mas é q este CSS da me dando um pau... hehheheh

;) (y)
* Otávio Nogueira
* Administração e Configuração de Servidores;
* Combinação Perfeita: NGINX + PHP + VARNISH + HAPROXY
* otavio*iporto.com ~ Tel: +55 51 3366 0177 | +55 51 4063 7343 |
* @iporto

#6 danillonunes

danillonunes

    Se tudo está funcionando bem, algo está errado, e vice-versa

  • Usuários
  • 182 posts
  • Sexo:Não informado
  • Localidade:Campinas - SP

Posted 01/01/2005, 01:16

BORDER-RIGHT: 2px solid #336666; BORDER-LEFT: 2px solid #336666; BORDER-BOTTOM: 7px solid #336666;
BORDER-TOP: 2px solid #336666; background-image url("img/dobra_topo.gif");


é isso?
Abraços
Marcus Danillo
http://danillonunes.net

#7 Luis Otávio

Luis Otávio

    Super Veterano

  • Usuários
  • 3113 posts
  • Sexo:Masculino
  • Localidade:Porto Alegre
  • Interesses:- Desenvolvimento de aplicações Web com linguagem server-side PHP.

    - Desenvolvimento de aplicações Web com linguagem cliente-side JavaScript, conhecedor e utilizador da biblioteca jQUERY e todas suas características.

    - Otimização de Desempenho aplicados a performance de banco de dados Mysql.

    - Otimização de Desempenho para servidores Web utilizando-se como Webserver NGINX em conjunto com Varnish.

    - Sólidos conhecimentos no CMS WordPress para novas implementações, manutenção, criação e otimização de Plugins.

    - Práticas de atendimento, relacionamento e suporte ao cliente. Trabalhando voltado ao público desde o lançamento da empresa iPORTO.COM, criando laços e vínculos com os mais de Mil clientes da empresa e os braços do grupo.

Posted 01/01/2005, 01:22

BORDER-RIGHT: 2px solid #336666; BORDER-LEFT: 2px solid #336666; BORDER-BOTTOM: 7px solid #336666;
BORDER-TOP: 2px solid #336666; background-image url("img/dobra_topo.gif");


é isso?

deste jeito num aparece a imagem em nenhum lugar...

se eu uso assim:


BORDER-RIGHT: 2px solid #336666;
BORDER-LEFT: 2px solid #336666;
BORDER-BOTTOM: 7px solid #336666;
BORDER-TOP: 2px solid #336666;
background-image: url("img/dobra_topo.gif");


como eu num to dizendo que a imagem tem q ficar de fundo no TOP aparece a imagem, mas aparece a imagem em todas as tags <td> da minha tabela...

q q será q é? :blink:

na minha tabela eu chamo assim..

<table cellpadding="0" cellspacing="0" width="700" height="459" class="TabelaEntrada">

ta certo né?

;) (y)
* Otávio Nogueira
* Administração e Configuração de Servidores;
* Combinação Perfeita: NGINX + PHP + VARNISH + HAPROXY
* otavio*iporto.com ~ Tel: +55 51 3366 0177 | +55 51 4063 7343 |
* @iporto

#8 Kaled

Kaled

    Unconditional

  • Usuários
  • 507 posts
  • Sexo:Não informado

Posted 01/01/2005, 02:28

iporto, o que você está tentando fazer ? você quer colocar um sombra somente no topo ?

#9 Luis Otávio

Luis Otávio

    Super Veterano

  • Usuários
  • 3113 posts
  • Sexo:Masculino
  • Localidade:Porto Alegre
  • Interesses:- Desenvolvimento de aplicações Web com linguagem server-side PHP.

    - Desenvolvimento de aplicações Web com linguagem cliente-side JavaScript, conhecedor e utilizador da biblioteca jQUERY e todas suas características.

    - Otimização de Desempenho aplicados a performance de banco de dados Mysql.

    - Otimização de Desempenho para servidores Web utilizando-se como Webserver NGINX em conjunto com Varnish.

    - Sólidos conhecimentos no CMS WordPress para novas implementações, manutenção, criação e otimização de Plugins.

    - Práticas de atendimento, relacionamento e suporte ao cliente. Trabalhando voltado ao público desde o lançamento da empresa iPORTO.COM, criando laços e vínculos com os mais de Mil clientes da empresa e os braços do grupo.

Posted 01/01/2005, 02:36

iporto, o que você está tentando fazer ? você quer colocar um sombra somente no topo ?

é, agora colocar sombra ta sendo o de menos... hahahahaha, o q eu queria mesmo, era colocar uma imagem nesta maldita borda... mas agora tava pensando... nem sei se é possivel colocar imagens em bordas.. hehe, é q agora que to me familiarizando com o css, antes naum usava ele...

então, agora o q eu quero por momento... é que esta é minha tabela

|--------------------------|
|.................................|
|.................................|
|.................................|
|.................................|
|.................................|
|.................................|
|.................................|
|--------------------------|

ai onde ta vermelho... seria a borda do topo, o atributo cor, funciona perfeitamente... agora o q eu queria... é que ficasse uma imagem ali... ao inves da cor.... para ficar algo assim:


|SSSSSSSSSSSSSSSS|
|.................................|
|.................................|
|.................................|
|.................................|
|.................................|
|.................................|
|.................................|
|--------------------------|


os SSSSSSSSSSSSSSS seriam a minha imagem.... entenderam? ou eu compliquei mais ainda? hehehehehe

:wacko: :blink:

;) (y)
* Otávio Nogueira
* Administração e Configuração de Servidores;
* Combinação Perfeita: NGINX + PHP + VARNISH + HAPROXY
* otavio*iporto.com ~ Tel: +55 51 3366 0177 | +55 51 4063 7343 |
* @iporto

#10 Kaled

Kaled

    Unconditional

  • Usuários
  • 507 posts
  • Sexo:Não informado

Posted 01/01/2005, 03:11

Acho que entendi :huh:

No CSS acrescente o seguinte:

#img_borda {
background: transparent url(url_imagem) repeat-x;
width: 700px;
padding-bottom: 10px;
}
A imagem está repetindo horizontalmente até atingir a largura de 700px.
O paddim-bottom determinará o espaço entre a tabela abaixo. Configure-o nos seus moldes

#img_borda h4 span { display: none; }
Essa parte é para ocultar o texto na tela.


Bem no topo da sua página, acima da tabela principal acrescente:

<div id="img_borda"><h4><span>Imagem Superior</span></h4></div>


Veja se dá certo aí !

#11 Luis Otávio

Luis Otávio

    Super Veterano

  • Usuários
  • 3113 posts
  • Sexo:Masculino
  • Localidade:Porto Alegre
  • Interesses:- Desenvolvimento de aplicações Web com linguagem server-side PHP.

    - Desenvolvimento de aplicações Web com linguagem cliente-side JavaScript, conhecedor e utilizador da biblioteca jQUERY e todas suas características.

    - Otimização de Desempenho aplicados a performance de banco de dados Mysql.

    - Otimização de Desempenho para servidores Web utilizando-se como Webserver NGINX em conjunto com Varnish.

    - Sólidos conhecimentos no CMS WordPress para novas implementações, manutenção, criação e otimização de Plugins.

    - Práticas de atendimento, relacionamento e suporte ao cliente. Trabalhando voltado ao público desde o lançamento da empresa iPORTO.COM, criando laços e vínculos com os mais de Mil clientes da empresa e os braços do grupo.

Posted 01/01/2005, 04:12

bha, KALED, valeu, era isso mesmo que eu queria, funcionou que é uma beleza... mas o ruim que funiconou em uma pagina nova que eu criei, mas quando coloco no meu lay num funfa :( mas isso eu vou dar um jeito de arrumar, valeu cara, pela ajuda...


PS: pergunta monga.. qual a diferença de começar com . e com # o nome da class?

;) (y)
* Otávio Nogueira
* Administração e Configuração de Servidores;
* Combinação Perfeita: NGINX + PHP + VARNISH + HAPROXY
* otavio*iporto.com ~ Tel: +55 51 3366 0177 | +55 51 4063 7343 |
* @iporto

#12 Kaled

Kaled

    Unconditional

  • Usuários
  • 507 posts
  • Sexo:Não informado

Posted 01/01/2005, 04:36

Blz ... dê uma estuda em tableless, que é a construção de sites sem o uso de tabelas.

O . (ponto) é a sintaxe do seletor tipo Classe, e o # é do ID.

Classe: é aplicável a um ou mais elementos HTML.
ID: é individual, só é aplicável somente a um elemento HTML.

Quer dizer que: não pode existir dois IDs iguais ... E pode existir dois ou mais Classes iguais.

Abraços !

#13 LarPhozyHah

LarPhozyHah

    Super Veterano

  • Usuários
  • 14515 posts
  • Sexo:Masculino
  • Localidade:San Miguel de Tucuman

Posted 24/09/2017, 11:38

Acheter Nolvadex France Buy Cialis 20mg Fda Approved Pharmacy cialis Cialis 10mg Or 20mg Where Can I Buy Betamethasone Cephalexin For Sinus

#14 HaroNism

HaroNism

    Super Veterano

  • Usuários
  • 15385 posts
  • Sexo:Masculino
  • Localidade:San Miguel de Tucuman

Posted 25/09/2017, 19:49

On Sale Progesterone Pills Free Doctor Consultation Propecia Forum 2012 cialis buy online Buy Nexium Uk20 Mg Nolvadex Pct Generic Female Cialis Viagra Apres Manger

#15 LarPhozyHah

LarPhozyHah

    Super Veterano

  • Usuários
  • 14515 posts
  • Sexo:Masculino
  • Localidade:San Miguel de Tucuman

Posted 30/09/2017, 11:58

Cialis Costo Originale Buy Dapoxetine Hcl Online cialis Buy Accutane Isotretinoin Online Cephalexin 500mg Cialis Lilly 20mg 12
Le Cialis Blog cheap cialis Cephalexin Overdose Levitra Effetti Collaterali Farmacia
Zithromax Iv In Children Overnight Femara Canadian cialis Viagra For Sale Cannada
Precio Propecia Espana Viagra Professional 100 Mg Generic Zentel Quick Shipping Mastercard Accepted online pharmacy Free Viagras Genuine Viagra Cheap Acheter Viagra Pfizer Quebec
Voltar para CSS & Semântica (Tableless)


1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

  1. Fórum WMO
  2. → Desenvolvimento
  3. → HTML, CSS e Metodologias
  4. → CSS & Semântica (Tableless)
  5. Privacy Policy
  6. Regras ·
IPB Skin By Virteq