فحص الموقع وتحديد نمط CSS؟

Question

أهدف إلى الحصول على شريط مماثل في الأعلى كما هو الحال هنا: http://www.keltainenporssi.fi/لون الموقع الحالي باللون الأحمر ، في حين أن المواقع الأخرى باللون الأسود.

كيف تصل إلى هدفي؟ ربما بواسطة PHP؟

قد يكون بناء الجملة في الرمز الزائف

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

Answer 1

النهج غير الديناميكي:

يمكنك استخدام قاعدة CSS لكل موقع ، مثل ذلك:

/* 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;
}

لغة البرمجة:

<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

من الشائع استخدام برنامج نصي من جانب الخادم مثل PHP للقيام بهذا الشيء. فمثلا:

<?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>';

?>

هذا من شأنه أن ينتج الناتج مثل: (منسقة لقدرة على القراءة)

<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

يمكنك الحصول على CSS واحد للشريط الذي ستجلبه جميع المجالات. تأكد من إضافة! قواعد مهمة حول CSS بحيث لا يتم تجاوز القواعد بأي شيء آخر. خلاف ذلك ، قم بحماية الشريط في "مساحة الاسم" عن طريق إضافة معرف على القائمة/div أو أي شيء ستستخدمه لتنفيذه.

Answer 4

نعم ، يمكنك تعيين فئة عنصر المرساة بناءً على الموقع الحالي.