現在の月間のシフト表がこのような状態です。
下の方にいくとどれが何日なのかわからなくなっていしまっています。
HtmlとCSSはほぼ勉強したことがないので、おしゃれ表 HTML とかで調べて編集するのですが、どうにもこうにもうまくいかない…
Djangoのルール、Python、HTML、CSS、そのうちjavascriptも覚えていかないと便利なWebアプリは作成できないかもしれないですね
本当にWebアプリはハードルがVBAよりはるかに高いですが、何事も０⇒１が一番大変な時期なのでHTML、CSSを覚える一番大変な状況と思って頑張ります(⌒∇⌒)
修正しようとしているHtmlですが、うまくいかなかったらバックアップから戻す可能性もあります…
schedule/month.html
{% extends 'schedule/base.html' %}
{% load static %}
{% block customcss %}
<linkrel="stylesheet"type="text/scc"href ="{% static 'schedule/month.css' %}">
{% endblock customcss %}
{% block header %}
<ulclass="page">
{% ifnotequal month 1 %}
<ahref="{% url 'schedule:monthschedule' year month|add:'-1' %}"class="btn-info btn active">前月</a>
{% else %}
<ahref="{% url 'schedule:monthschedule' year|add:'-1' 12 %}"class="btn-info btn active">前月</a>
{% endifnotequal %}
{% ifnotequal month 12 %}
<ahref="{% url 'schedule:monthschedule' year month|add:'1' %}"class="btn-info btn active">次月</a>
{% else %}
<ahref="{% url 'schedule:monthschedule' year|add:'1' 1 %}"class="btn-info btn active">次月</a>
{% endifnotequal %}
<ahref="{% url 'schedule:schedulecreate' year month %}"class="btn-info btn active">シフト作成</a></ul><p>
{% for shisetsu in shisetsu_object %}
<spanstyle="background-color:{{ shisetsu.color }}">{{ shisetsu.name }}</span>
{% endfor %}
</p>
{{ kikan }}
{% for shift in shift_object %}
{% if shift.name != "休" and shift.name != "有" %}
{{ shift.name }} : {{ shift.start_time | date:"G"}}～{{ shift.end_time | date:"G"}}
{% endif %}
{% endfor %}
{% endblock header %}
{% block content %}
<divclass='text-nowrap table-responsive'><tableclass='table table-striped table-hover table-fixed'><thead><tralign="center"class="info"><!--日付--><throwspan="2"></th>
{% for item in calender_object %}
<thclass="day_{{ item.date }}">{{ item.date | date:"d" }}</th>
{% endfor %}
<tralign="center"class="info"><!--曜日-->
{% for item in youbi_object %}
<thclass="day_{{ item.date }}">{{ item }}</th>
{% endfor %}
</tr></thead><tbody>
{% for profile in profile_list %}
{% for staff in user_list %}
{% if profile.user_id == staff.id %}
<tralign="center"><throwspan="1"class="staff_name"staff_id="{{ staff.staff_id }}"width="200">{{ staff.last_name }}{{ staff.first_name }}</th><!--staff_id要素はjsで使う-->
{% for item in object_list %}
{% if item.user|stringformat:"s" == staff.username|stringformat:"s" %}<!--usernameが同一なら--><tdclass="day"id="s{{ staff.id }}d{{ item.date }}">
{% if item.shift_name_1 != None %}
{% if item.shift_name_1|stringformat:"s" == "有" or item.shift_name_1|stringformat:"s" == "休" %}
{{ item.shift_name_1 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_1|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<spanstyle="background-color:{{ shisetsu.color }}">{{ item.shift_name_1 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if item.shift_name_2 != None %}
{% if item.shift_name_2|stringformat:"s" == "有" or item.shift_name_2|stringformat:"s" == "休" %}
{{ item.shift_name_2 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_2|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<spanstyle="background-color:{{ shisetsu.color }}">{{ item.shift_name_2 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if item.shift_name_3 != None %}
{% if item.shift_name_3|stringformat:"s" == "有" or item.shift_name_3|stringformat:"s" == "休" %}
{{ item.shift_name_3 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_3|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<spanstyle="background-color:{{ shisetsu.color }}">{{ item.shift_name_3 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if item.shift_name_4 != None %}
{% if item.shift_name_4|stringformat:"s" == "有" or item.shift_name_4|stringformat:"s" == "休" %}
{{ item.shift_name_4 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_4|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<spanstyle="background-color:{{ shisetsu.color }}">{{ item.shift_name_4 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% endif %}
{% endfor %}
</td><tralign="center">
{% for month in month_total %}
{% if month.user == staff.id %}<!--usernameが同一なら--><td><b>{{ month.month_total_worktime }}</b></td>
{% endif %}
{% endfor %}
{% for item in object_list %}
{% if item.user|stringformat:"s" == staff.username|stringformat:"s" %}<!--usernameが同一なら--><tdclass="day"id="s{{ staff.id }}d{{ item.date }}"><ahref="{% url 'schedule:update' item.pk %}">{{ item.day_total_worktime }} </a></td>
{% endif %}
{% endfor %}
</tr>
{% endif %}
{% endfor %}
{% endfor %}
</tbody></table></div>
{% endblock content %}
CSSは、
schedule/month.css
table{border-collapse:separate;border-spacing:0;}tablethead:first-child{border-radius:5px000;}tablethead:last-child{border-radius:05px00;border-right:1pxsolid#3c6690;}tablethead{text-align:center;color:white;background:linear-gradient(#829ebc,#225588);border-left:1pxsolid#3c6690;border-top:1pxsolid#3c6690;border-bottom:1pxsolid#3c6690;box-shadow:0px1px1pxrgba(255,255,255,0.3)inset;padding:10px0;}これでやってもCssが適用されません。
htmlに記載している、Tableのところに