Magickarte als CSS

Als kleines Beispiel was man mit CSS alles machen kann.
In meiner Magic Datenbank stelle ich alle Karten ohne Bild mit diesem CSS Code dar. Der HTML-Code kann im Quelltext nachgelesen werden, sollte aber anhand des CSS-Codes selbsterklärend sein.

CSS:

.magic.cardBorder {border-radius: 10px; width:214px; height:300px; overflow:hidden; background-color:black; font: 12px Verdana; padding:5px;}
.magic.cardBody {background-color:#ffffa0; padding:5px; width:204px;}
.magic.cardName{background-color:white; height:15px;}
.magic.cardMana{text-align: right; background-color:white; float:right;}
.magic.cardInPic{margin: 2px; height:130px; border:1px solid black;background-color:white;}
.magic.cardType{float:left;}
.magic.cardSymbol{text-align: right; height:15px;}
.magic.cardAbility{margin: 2px; height:102px; border:1px solid black;background-color:white;}
.magic.cardInfo{background-color:white; height:15px;}
.magic.cardPower{text-align: right; background-color:white; float:right;} 

Ergebnis:

Platin-Engel 

 [7]

&nbsp

Artefaktkreatur — Engel 

Fliegend (Diese Kreatur kann außer von fliegenden Kreaturen und Kreaturen mit Reichweite nicht geblockt werden.) Du kannst das Spiel nicht verlieren, und deine Gegner können das Spiel nicht gewinnen. 

In seinem Herzen liegt das Geheimnis der Unsterblichkeit verborgen.

Brom, Nr:339

4/4