0

I would like to override the default Python Calendar CSS. I am currently using the class calendar.HTMLCalendar and would like to override the default python calendar css.

What is the smartest way in overriding the default css? Any help or suggestions would be appreciated.

I would like to use my calendar css.

-Keoko

Here is a sample of the templatetag that I am using:

  def formatday(self, day, weekday):
       if day != 0:
           cssclass = self.cssclasses[weekday]
           if date.today() == date(self.year, self.month, day):
           cssclass += ' today'
       if day in self.readings:
           cssclass += ' filled'
           body = ['<ul>']
           for reading in self.readings[day]:
              body.append('<li>')
              body.append('<a href="%s">' % reading.get_absolute_url())
              body.append(esc(reading.series.primary_name))
              body.append('</a></li>')
           body.append('</ul>')
           return self.day_cell(cssclass, '<span class="dayNumber">%d</span> %s' %  (day, ''.join(body)))
        return self.day_cell(cssclass, '<span class="dayNumberNoReadings">%d</span>' % (day))
    return self.day_cell('noday', '&nbsp;')

Thanks again.

4

3 に答える 3

0

オーバーライドする必要のあるルールを正確に確認しなくても、CSSルールは既存のルールよりも具体的である必要があります。それを達成する方法はいくつかありますが、それはどのルールがすでに実施されているかによって異なります。

入門書として、http://css-tricks.com/specifics-on-css-specificity/をご覧ください。それはあなたがあなたが変更したいスタイルをどのように最もよくオーバーライドすることができるかについてあなたにいくつかの指針を与えるでしょう。

実装しているPythonカレンダーCSSから次のスタイルがあるとします。

.calendar .day {
    background-color: #ccc;
}

このスタイルをオーバーライドするには、次のようにします。

table.calendar .day  // or

.calendar td.day  // or

table.calendar td.day

カレンダーは月のa<table>を出力し、CSSクラスはテーブルに「month」、<th>タグに「month」があります。したがって、スタイルをオーバーライドするには、次のようにします。

table.month th.month {
  // your style here
}

ただし、スタイルを適用する前にDOMがすべてのテーブルタグを検索するため、これはあまり効率的なセレクターではありません。はるかに効率的なセレクターは、カレンダーをターゲットdivタグでid:でラップすることです。

#mycalendar .month .month {
  // your style
}

これは特に「mycalendar」のIDを持つdivを対象としているため、すべてのタグをループする必要はありません。

提供されているPythonカレンダーCSSコードからのCSSの特異性をオーバーライドする必要があります。上記のサンプルは、より具体的なセレクターを提供します。これは、カスケードスタイルシートの最も基本的な原則の1つです(「カスケード」部分に重点が置かれていることに注意してください)。

于 2013-03-07T15:45:16.327 に答える
0

サンプルコードから。次のように<ul>にクラス名を追加するとします。

def formatday(self, day, weekday):
       if day != 0:
           cssclass = self.cssclasses[weekday]
           if date.today() == date(self.year, self.month, day):
           cssclass += ' today'
       if day in self.readings:
           cssclass += ' filled'
           body = ['<ul class="sample">'] //<---------add class
           for reading in self.readings[day]:
              body.append('<li>')
              body.append('<a href="%s">' % reading.get_absolute_url())
              body.append(esc(reading.series.primary_name))
              body.append('</a></li>')
           body.append('</ul>')
           return self.day_cell(cssclass, '<span class="dayNumber">%d</span> %s' %  (day, ''.join(body)))
        return self.day_cell(cssclass, '<span class="dayNumberNoReadings">%d</span>' % (day))
    return self.day_cell('noday', '&nbsp;')

次に、cssコードで、次のように記述できます。

<style>
.sample {
    background:red;
    font-weight: bold;
}
</style>
于 2013-03-07T18:25:24.730 に答える