Reth: class element für mehrere hrefs verwenden

Beitrag lesen

SELF-Forum

class element für mehrere hrefs verwenden

Reth
– Informationen zu den Bewertungsregeln

Hast du einen Link zu deinen bisherigen Bemühungen?

Hi zusammen,

vielen Dank für eure Antworten. Link hab ich leider keinen, aber ein bisschen Code (s.u.). Ich möchte gern alle "a hrefs" für Thema1 mit buttongrey formatieren, die für Thema2 mit buttonblue usw. usf., ohne dass ich wie im Bsp. unten jeweils die class an jeden "a href" einzeln schreiben muss. Gibt es da ne Möglichkeit?

Zudem möchte ich das Seitenlayout zweispaltig machen. Ist da immer noch der Weg über eine Tabelle die erste Wahl (wie früher, "vorm Krieg" :) )? Oder gibt es da Besseres? Die Seite ist nur für Monitore und Laptops vorgesehen, nicht für mobilere Endgeräte wie Tablets und Smartphones.

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

<HEAD> 
<TITLE></TITLE>
<style type="text/css">
  body {
    color: grey;
    font-family: arial, sans-serif;
    width: 30em;
  }
  .buttongrey, .buttonblue, .buttongreen, .buttonorange {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 5px 5px #313131, 0 9px 0 #393939, 0 9px 10px rgba(0, 0, 0, 0.4), 0 2px 9px rgba(255, 255, 255, 0.2) inset, 0 -2px 9px rgba(0, 0, 0, 0.2) inset;
    color: #FFFFFF;
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 6px 20px;
    position: relative;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
    width: 450px;
    left: 30px;
  }
  .buttongrey {
    background-color: #666666;
  }
  .buttonblue {
    background-color: MidnightBlue;
  }
  .buttongreen {
    background-color: DarkGreen;
  }
  .buttonorange {
    background-color: DarkOrange;
  }
</style>
</HEAD> 

<BODY>
<H3>Linksammlung</H3>
<nobr><H4>&nbsp;&nbsp;&nbsp;Thema1</H4></nobr>
<a href="..." class="buttongrey">Punkt 1</a>
<a href="..." class="buttongrey">Punkt 2</a>
<a href="..." class="buttongrey">Punkt 3</a>
<H4>&nbsp;&nbsp;&nbsp;Thema 2</H4>
<a href="..." class="buttonblue">Punkt 1</a>
<a href="..." class="buttonblue">Punkt 2</a>
<a href="..." class="buttonblue">Punkt 3</a>
<H4>&nbsp;&nbsp;&nbsp;Thema 3</H4>
<a href="..." class="buttongreen">Punkt 1</a>
<a href="..." class="buttongreen">Punkt 2</a>
<a href="..." class="buttongreen">Punkt 3</a>
...
Beitrag melden
–
Informationen zu den Bewertungsregeln