Buchtitel und Autor als volltransparente Schrift ueber das Bild legen #18

New issue

Open

opened 2021-09-09 21:39:52 +02:00 by mannimmond · 1 comment

mannimmond commented

2021-09-09 21:39:52 +02:00

Den Buchtitel und den Autor als volltransparente Schrift ueber das Bild legen wuerde helfen, Buecher per Browsersuche zu finden.

mannimmond commented

2021-09-09 22:20:04 +02:00

Author

Prototyp:

.cover-item {
    position: relative;
    width: 265px;
    margin-bottom: 5px;
    border: 1px solid #FFE5C6;
}
.cover-item:hover {
    opacity: 0.7;
}

.cover-item img {
    width: 265px;
    vertical-align: top;
}

.cover-item span{
    background-color: hsla(0, 0%, 100%, 0.0);
    color: hsla(0, 0%, 100%, 0.0);
    position: absolute;
    left: 0;
    top: 0;
}

<div class="cover-item" style="position: absolute; left: 0px; top: 0px;">
                <a target="_blank" href="https://yourbook.shop/book/?isbn=9783641013967&amp;ref=mezzo&amp;aff=mr">
                    <img src="okoyono.de%20--%20Buch%20des%20Monats_files/9783641013967.jpg" alt="Wolfgang Jeschke - Der letzte Tag der Schöpfung" title="zu yourbook.shop"></a>
                    <span>Wolfgang Jeschke - Der letzte Tag der Schöpfung</span>
                </div>

Prototyp: ```css .cover-item { position: relative; width: 265px; margin-bottom: 5px; border: 1px solid #FFE5C6; } .cover-item:hover { opacity: 0.7; } .cover-item img { width: 265px; vertical-align: top; } .cover-item span{ background-color: hsla(0, 0%, 100%, 0.0); color: hsla(0, 0%, 100%, 0.0); position: absolute; left: 0; top: 0; } ``` ```html <div class="cover-item" style="position: absolute; left: 0px; top: 0px;"> <a target="_blank" href="https://yourbook.shop/book/?isbn=9783641013967&ref=mezzo&aff=mr"> <img src="okoyono.de%20--%20Buch%20des%20Monats_files/9783641013967.jpg" alt="Wolfgang Jeschke - Der letzte Tag der Schöpfung" title="zu yourbook.shop"></a> <span>Wolfgang Jeschke - Der letzte Tag der Schöpfung</span> </div> ```

No labels

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: mezzo/buch_des_monats#18

No description provided.