Background Alfa

**malaspina76** · 22-01-2008, 23:35

Ciao a tutti!
Ho bisogno di un aiuto per realizzare un layout per un sito. Il problema che ho riguarda i background della pagina e della struttura principale.
Ora nell'immagine il con la lettera A ho indicato lo sfondo della pagina. Ho bisogno che il fiore bianco sia fisso in alto a sinistra della pagina anche quando si scorre lo schermo verso il basso...come si fa?
E il problema numero due....vorrei mettere nella tabella centrale (B) uno sfondo trasparente...tipo con alfa in photoshop...come si fa?
Non mi è mai capitato di fare ste cose ma a richiesta non ho saputo dare risposta!
Grassie in anticipo per l'aiuto!

**Max1** · 23-01-2008, 00:53

Spero di aver capito la tua richiesta:

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>.......</title>

<style type="text/css">
<!--
#fiore { top: 0; left: 0; position: fixed; width: 150px; height: 150px; }
#tabella_b { background-color: transparent; background-repeat: no-repeat; }
-->
</style>

</head>

<body>
<div id="fiore">
[img]fiore.jpg[/img]
</div>

<div><table width="100%" border="0" cellspacing="20" cellpadding="10">
  <tr>
    <td>
    <div id="tabella_b"><table width="100%" border="0" cellspacing="20" cellpadding="10">
  <tr>
    <td></td>
  </tr>
</table>
</div>
</td>
  </tr>
</table>
</div>
</body>

</html>

**malaspina76** · 23-01-2008, 11:01

Probabilmente è proprio la risposta che cercavo...nel pomeriggio lo provo e ti faccio sapere!
Grassie ancora!

**malaspina76** · 23-01-2008, 12:58

Ancora niente!
Posto la pagina base e vediamo se riesco a spiegare le correzioni che voglio apportare.
[CODE<html>
<head>
<title>.......</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body background="fiore.jpg">
<table width="780" border="0" align="center" cellpadding="0" cellspacing="0" background="bg.gif">
<tr>
<td width="780" height="27"></td>
</tr>
</table>
<table width="780" border="0" align="center" cellpadding="0" cellspacing="0" background="bg_1.gif">
<tr>
<td width="780" height="510"></td>
</tr>
</table>
<table width="780" border="0" align="center" cellpadding="0" cellspacing="0" background="bg_2.gif">
<tr>
<td width="780" height="23"></td>
</tr>
</table>
</body>
</html>
[/CODE]

Ora il fiore nero deve rimanere fisso in alto a sinistra e non essere ripetuto come succede a me.
La tabella centrale (costituita da tre tabelle vorrei abbia sfondo trasparente)

MAX1 nell'esempio che mi hai postato prima il fiore lo riconosceva come immagine e non come bg e di conseguenza la tabella, la portava sotto l'immagine!!
Non ci sto a capì niente!

**malaspina76** · 23-01-2008, 13:01

Dimenticavo di postare un'immagine di come vedo io il tutto!

**Vincent.Zeno** · 23-01-2008, 13:50

http://www.w3schools.com/css/css_background.asp
http://www.w3schools.com/css/css_image_transparency.asp

example:

codice:

 
CSS

body
{ 
background-image: url('fiore.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-color:green;
}

#table1
  {
  width: 400px;
  height: 180px;
  margin: 30px 50px;
  background-color: #ffffff;
  border: 1px solid black;
  /* for IE */
  filter:alpha(opacity=60);
  /* CSS3 standard */
  opacity:0.6;
  }

**Max1** · 23-01-2008, 14:23

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>....</title>

<style type="text/css" media="screen">
<!--
html, body {
	background-color:#999999;
	background-image:url('fiore.jpg');
	background-repeat:no-repeat;
}

table {
	background: trasparent;
}

-->
</style>
</head>

<body>

<table width="780" border="0" align="center" cellpadding="0" cellspacing="0">
<tr> 
<td width="780" height="27"> </td>
</tr>
</table>
<table width="780" border="0" align="center" cellpadding="0" cellspacing="0">
<tr> 
<td width="780" height="510"> </td>
</tr>
</table>
<table width="780" border="0" align="center" cellpadding="0" cellspacing="0">
<tr> 
<td width="780" height="23"> </td>
</tr>
</table>
</body>
</html>

**malaspina76** · 23-01-2008, 15:08

Grazie ancora per la pazienza!
Tramite il CSS esterno ho risolto il BG della pagina (lasciarlo fisso in alto a sinistra).
Purtroppo il problema persiste per i bg delle singole tabelle. (anche perchè non è che sia così pratico di css).

Se volessi inserire il css nel codice della singola tabella B - c - D (nel disegno...potrebbe essere un rimedio?

Avevo pensato anche di ridurre l'alfa nello sfondo creato con photoshop, ma anche se esportato in gif non lo mantiene!!

**malaspina76** · 23-01-2008, 15:13

Anzi no rettifico!!!

Ho provato ... ma non mantiene nemmeno fisso il bg della pagina...non lo ripete ma non segue nemmeno il layout!

Mi potreste consigliare qualcosa da leggere sui css per quanto riguarda lo sfondo? Perchè così a tentoni e imboccato non è che sia il massimo!!

**Vincent.Zeno** · 23-01-2008, 22:41

... a meno che tu nn abbia cambiato le tue esigenze...
la risposta che ti ho dato è giusta, l'hai provata?

demo

Discussione: Background Alfa

Strumenti discussione

Ricerca discussione

Visualizza

Background Alfa

Permessi di invio