Aggiunta codice css inline

**mandrake_01** · 12-01-2010, 12:37

Utilizzo questo codice per rendere piu' omogenea la visualizzazione di immagini dalla forma "irregolare" tramite estrapolazione da db via php.

<div id="Box" style="width:130px; height:130px; background-image:url(tbn/$list[img]); background-repeat:no-repeat; background-position: center center; BORDER: #FFFFFF solid 6px;"></div>

Non essendo molto eperto di css vi chiedo se è possibile integrare questo codice con i seguenti "effetti":

- Al passaggio del mouse far diventare i bordi di 8px
- Al passaggio del mouse avere una patinatura sull'immagine di sfondo o avere un'immagine patinata e al passaggio del mouse eliminare la patinatura.

Spero possiate aiutarmi.

Grazie
Ciao

**marco.carrieri** · 12-01-2010, 18:47

La patinatura purtroppo non l'ho capita mannaggia.

Codice PHP:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

    <head>

        <title>prova</title>

        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

        <meta name="generator" content="HAPedit 3.1">

        <style type="text/css">

        #box

        {

            width:130px; 

            height:130px;

            background-image:url(tbn/$list[img]); 

            background-repeat:no-repeat; 

            background-position: center center; 

            BORDER: #ff0000 solid 6px;

        }

        #box:hover

        {

            BORDER: #ff0000 solid 8px;

        }

        </style>

    </head>

    <body>

        <div id="box" style="">hh</div>

    </body>

</html>

**mandrake_01** · 12-01-2010, 19:34

Ti ringrazio,
ma io vorrei mettere tutto su una riga come nell'esempio che ho postato, visto che l' immagine di background viene definita in modo dinamico attraverso php, altrimenti non saprei come fare...

per quanto riguarda la patinatura fa lo stesso...

Grazie
Ciao

**marco.carrieri** · 12-01-2010, 19:40

Beh ma inline puoi andare a ridefinire solo il background image.
Tutti le altre formattazioni restano in memoria.

**mandrake_01** · 13-01-2010, 15:21

Così ?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>prova</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 3.1">
<style type="text/css">
#box
{
width:130px;
height:130px;
background-repeat:no-repeat;
background-position: center center;
BORDER: #ff0000 solid 6px;
}
#box:hover
{
BORDER: #ff0000 solid 8px;
}
</style>
</head>
<body>
<div id="box" style="background-image:url(tbn/$list[img]);">hh</div>
</body>
</html>

Grazie

**marco.carrieri** · 13-01-2010, 18:11

$list[img] è una variabile php?

**mandrake_01** · 13-01-2010, 18:34

Originariamente inviato da marco.carrieri
$list[img] è una variabile php?

Si. In pratica il div box viene messo in un ciclo php e $list[img] fa riferimento ad un'immagine diversa ad ogni ciclo.

**marco.carrieri** · 13-01-2010, 18:36

Allora la devi scrivere cosi.
<div id="box" style="background-image:url(tbn/<?php echo $list[img] ?>);">hh</div>

**mandrake_01** · 13-01-2010, 18:38

Ti ringrazio molto per l'aiuto.

Ciao!

Discussione: Aggiunta codice css inline

Strumenti discussione

Ricerca discussione

Visualizza

Aggiunta codice css inline

Permessi di invio