Controllando il sito e decidendo quindi lo stile CSS?

Question

Mi propongo di avere una barra simile in alto come qui: http://www.keltainenporssi.fi/ Il colore del sito corrente è in rosso, mentre altri siti sono in nero.

Come raggiungeresti il ??mio obiettivo? Forse per php?

La sintassi nello pseudo-codice può essere

if $site = A
    use-styleA
if $site = B
    use-styleB
else
    use-FinalStyle

Answer 1

Approccio non dinamico:

Puoi utilizzare una regola CSS per ogni sito, in questo modo:

/* site-one.css */
#top-nav li.site-one a {
    color: red;
}

/* site-two.css */
#top-nav li.site-two a {
    color: red;
}

/* site-three.css */
#top-nav li.site-three a {
    color: red;
}

HTML:

<ul id="top-nav">
    <li class="page-one"><a href="pages/one">Page one</a></li>
    <li class="page-two"><a href="pages/two">Page two</a></li>
    <li class="page-three"><a href="pages/three">Page three</a></li>
</ul>

Answer 2

È comune usare uno script lato server come PHP per fare una cosa del genere. Ad esempio:

<?PHP

echo '<ul id="top-nav">';

foreach($page as $pageId => $text) {
    echo '<li';
    if($curPage == $pageId)
        echo ' class="active"';
    echo '>';
    echo '<a href="pages/' . htmlspecialchars($pageId) . '">';
    echo htmlspecialchars($text);
    echo '</a>';
    echo '</li>';
}

echo '</ul>';

?>

Questo produrrebbe un output come: (formattato per la leggibilità)

<ul id="top-nav">
    <li><a href="pages/home">Home</a></li>
    <li class="active"><a href="pages/one">Page one</a></li>
    <li><a href="pages/two">Page two</a></li>
</ul>

Answer 3

Puoi avere un singolo css per la barra che verranno recuperati da tutti i domini. Assicurati di aggiungere! Regole importanti su quel CSS in modo che le sue regole non vengano sostituite da nient'altro. Altrimenti, schermare la barra in uno "spazio dei nomi" aggiungendo un ID nell'elenco / div o qualunque cosa tu utilizzi per implementarlo.

Answer 4

Sì, è possibile assegnare la classe dell'elemento anchor in base al sito corrente.