immagini in background per tooltip con css

**gibbosus** · 23-07-2015, 22:07

ciao vorrei impostare un'immagine di sfondo in questo tooltip
questo è il codice che uso per il testo senza immagine. Non riesco a modificarlo

codice:

    .tooltip{
               display: inline;
            position: relative;
            
            
        }
        
        .tooltip:hover:after{
            background: #EC41F2;
            border-radius: 5px;
            bottom: 26px;
            color: #000000;
            text-align:justify;
            content: attr(title);
            left: 20%;
            padding: 5px 15px;
            position: absolute;
            z-index: 98;
            width: 200px;
            height: 200px;
        }
        
        .tooltip:hover:before{
            border: solid;
            border-color: #EC41F2 transparent ;
            border-width: 6px 6px 0 6px;
            bottom: 20px;
            content: "";
            left: 50%;
            position: absolute;
            z-index: 99;
        }
    
    </style>
    
    
</head>
<body>


<p><br />
  <br /><br />
</p>
testo ..............
<p><br />
  <a href="#" title="abcd" class="tooltip"><span title="More">qualcosa</span></a></p>
testo ..............

**gibbosus** · 24-07-2015, 12:17

scrivendo

codice:

background: url(pippo.jpg) no-repeat;

nel secondo blocco di css si riesce ad avere l'immagine di sfondo ma per avere più tooltip con caretteristiche uguali e sfondi diversi cosa posso scrivere?
si può fare lo style con lo sfondo in linea qui e dirgli cosa usare ogni volta?

codice:

<a href="#" title="abcd" class="tooltip"><span title="More">qualcosa</span></a>

come si può fare?

[/CODE]

Discussione: immagini in background per tooltip con css

Strumenti discussione

Ricerca discussione

Visualizza

immagini in background per tooltip con css

Permessi di invio