FindeLinks //
  • Startseite
  • Ende
  • 2022
  • 2021
  • 2020
  • 2019
  • 2018

Navigation

  • Auto und Verkehr
  • Ausbildung, Schule und Uni
  • Alten- und Krankenpflege
  • Babys und Kinder
  • Bauen und Renovieren
  • Christlicher Glaube / Bibel
  • Computer und Internet
  • Essen und Trinken
  • Fotografie und Filme
  • Gesundheit / Körperpflege
  • Pflanzen und Tiere
  • Rechts- und Steuerhilfe
  • Reiseberichte / Ausflugtipps
  • Sicherheit / Unfallverhütung
  • Wohnen und Einrichten

Dot Leaders - führende Punkte

Für die Verwendung in WebSite X5 in einen HTML-Code Objekt bei Punkt 4 Seiten. - natürlich auch für andere Webeditoren.

Beispiel für eine Speisekarte (das Pixabay-Bild ist nicht im Code unten enthalten)

Vorschau der Speisekarte im Programm WebSite X5


Und hier der verwendete Code:

<style>
.toc li {
display: flex;
}

.toc li .title {
order: 1;
font-weight: bold;
}

.toc li .chapter {
order: 3
;
font-weight: bold;
}

.toc li::after {
background-image: radial-gradient(circle, currentcolor 1px, transparent 1.5px);
background-position: bottom;
background-size: 1ex 4.5px;
background-repeat: space no-repeat;
content: "";
flex-grow: 1;
height: 1em;
order: 2;
}

p {
text-align: left;

font-style: italic;
}
</style>


<div>
<ul class="toc">


<li> <span class="title">CAPRICCIOSA</span> <span class="chapter">7,95 Euro</span></li>
<p>Tomato sauce, mozzarella, Prosciutto Cotto cooked ham, mushrooms & black olives</p><br>


<li> <span class="title">HAWAIIAN</span> <span class="chapter">9,95 Euro</span></li>
<p>Tomato sauce, mozzarella, Prosciutto Cotto cooked ham & Pineapple</p><br>


<li> <span class="title">HOT & SPICY</span> <span class="chapter">7,95 Euro</span></li>

<p>Pepperoni, rødløg, jalapeños, peberfrugt, chili flager</p><br>


<li> <span class="title">CHICKEN KEBAB</span> <span class="chapter">5,25 Euro</span></li>
<p>Rødløg, kylling kebab, hvidløgsdressing</p><br>


<li> <span class="title">BBQ MIXED GRILL</span> <span class="chapter">10,95 Euro</span></li>
<p>BBQ sauce, mozzarella, chicken, bacon, Prosciutto Cotto cooked ham, beef, peppers & red onion</p>


</ul>
</div>


Der Code stammt von einem User der Community-Seite (Forum) von Incomedia, er wurde im Dezember 2022 etwas angepasst, damit der Preis fett und der Text in der jeweils 2. Zeile kursiv und schwarz ist - siehe Screenshot oben.

Incomedia Forum >> https://helpcenter.websitex5.com/de/community

Bearbeitungshinweise:

A) Den Code noch anpassen, siehe den unterstrichenen Teil unten für die Name der Speisen, den Preis und den Zusatztext.

<li> <span class="title">CAPRICCIOSA</span> <span class="chapter">7,95 Euro</span></li>
<p>Tomato sauce, mozzarella, Prosciutto Cotto cooked ham, mushrooms & black olives</p><br>

B) Falls die Zahl der Speisen erhöht werden soll, dann einfach diese kleinen Code-Abschnitte- siehe A) - kopieren und unterhalb der anderen kleinen Code-Abschnitte hinzufügen, anschliessend noch den Text (siehe oben den unterstrichenen Teil) anpassen

C) Sollen Speisen aus der Speisekarte entfernt werden, dann einfach die entsprechenden kleinen Code-Abschnitte löschen.

D) Soll die Reihenfolge der Speisen geändert werden, dann einfach die Reihenfolge der kleinen Code-Abschnitte ändern.
(c) 2012 - FindeLinks.de | Designed by freietemplates.de  
Datenschutz  Impressum