0

basic_project のクローンを作成し、これに従ってカスタマイズしようとしました - http://pinaxproject.com/docs/0.7/tabs/#ref-tabs

新しいアプリ「myapp」を作成し、新しいタブを right_nav に追加し、「site_tabs.css」も編集しました。
ただし、タブをクリックすると、ページは myapp に変わりますが、タブの背景色は変わりません。

ドキュメントのこの行は、Create a myapps/base.html template that all pages under that tab will extend. Make sure it defines a block body_class with content myapp私を混乱させています。

それは何"body_class" with content myappですか?、「{% block body_class%}」を持つクラスの「div」ですか?

myapp ページの私のコードは今のところ非常に単純です -

{% extends "site_base.html" %}
{% load i18n %}
{% load ifsetting_tag %}
{% block head_title %}
{% trans "Custom App page" %}
{% endblock %}

< div class="myapp">
< h1 >
{% trans "Custom App page" %}</h1>
{% if user.is_authenticated %}
< p >You are signed in !!</p>
{% else %}
< p >You are NOT signed in !!</p>
{% endif %}
< /div >

site_base.css は次のとおりです。

body.profile #tab_profile a,
body.myapp #tab_myapp a,
body.notices #tab_notices a
{
color: #000; /* selected tab text colour */
}

body.profile #tab_profile,
body.myapp #tab_myapp,
body.notices #tab_notices
{
margin: 0; /* to compensate for border */
padding: 5px 0 5px;
background-color: #DEF; /* selected tab colour */
border-left: 1px solid #000; /* tab border */
border-top: 1px solid #000; /* tab border */
border-right: 1px solid #000; /* tab border */
}

どんな指針も素晴らしいでしょう。ありがとう。

4

1 に答える 1

1

次のようなコンテンツを使用して、body_class内部で名前が付けられたブロックを定義するだけです。site_base.htmlmyapp

{% block body_class %}myapp{% endblock %}

これにより、 で定義されたブロックがオーバーライドされbase.htmlます。

<body class="{% block body_class %}{% endblock %}">

タブをアクティブにするために CSS によって使用される可能性があります。ドキュメントの下部にある例を参照してください。

body.profile #tab_profile a,
body.blogs #tab_blogs a,
body.bookmarks #tab_bookmarks a
{
    color: #000; /* selected tab text colour */
}

ここで、テンプレートを使用するページを開く場合、body タグは次のようになります。

<body class="myapp">

したがって、上記の CSS セレクターはあなたのタブに一致する可能性があります。

body.myapp #tab_myapp a { // active
于 2011-02-09T20:35:18.150 に答える