質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

デザイン

プログラミングでのデザインとは、プログラムの構成や、使用の信頼性・持続性・正確性・利便性の目標達成にはどうするのがベストなのか特定の選択を行うことです。

ページネーション

Webアプリケーションにおいて、1ページに収まらないコンテンツを、各ページへのリンクを並べてアクセスしやすくする手法をページネーションと呼びます。

Python

Pythonは、コードの読みやすさが特徴的なプログラミング言語の1つです。 強い型付け、動的型付けに対応しており、後方互換性がないバージョン2系とバージョン3系が使用されています。 商用製品の開発にも無料で使用でき、OSだけでなく仮想環境にも対応。Unicodeによる文字列操作をサポートしているため、日本語処理も標準で可能です。

Q&A

解決済

1回答

795閲覧

ページネーションのデザイン方法

reol-777

総合スコア14

Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

デザイン

プログラミングでのデザインとは、プログラムの構成や、使用の信頼性・持続性・正確性・利便性の目標達成にはどうするのがベストなのか特定の選択を行うことです。

ページネーション

Webアプリケーションにおいて、1ページに収まらないコンテンツを、各ページへのリンクを並べてアクセスしやすくする手法をページネーションと呼びます。

Python

Pythonは、コードの読みやすさが特徴的なプログラミング言語の1つです。 強い型付け、動的型付けに対応しており、後方互換性がないバージョン2系とバージョン3系が使用されています。 商用製品の開発にも無料で使用でき、OSだけでなく仮想環境にも対応。Unicodeによる文字列操作をサポートしているため、日本語処理も標準で可能です。

0グッド

0クリップ

投稿2021/01/01 06:01

編集2021/01/01 06:38

todoアプリを作っているのですが、ページネーションのデザインを変えたいです。どのように変えればよいのでしょうか?単純にCSSとかでできますか?cssで変えられるのかどうかだけ教えてください。
イメージ説明

pagination

1{% load static %} 2{% block customcss %} 3 <link rel='stylesheet' href="{% static 'style.css' %}"> 4{% endblock customcss %} 5 6<div class="page"> 7 <ul class="pagination"> 8 <!-- 前へ の部分 --> 9 {% if page_obj.has_previous %} 10 <li class="page-item"> 11 <a class="page-link" href="?page={{ page_obj.previous_page_number }}"> 12 <span aria-hidden="true">&laquo;</span> 13 </a> 14 </li> 15 {% else %} 16 <li class="page-item"> 17 <a class="page-link" href="#"> 18 <span aria-hidden="true">&laquo;</span> 19 </a> 20 </li> 21 {% endif %} 22 23 <!-- 数字の部分 --> 24 {% for num in page_obj.paginator.page_range %} 25 {% if page_obj.number == num %} 26 <li class="page-item active"><a class="page-link" href="#!">{{ num }}</a></li> 27 {% else %} 28 <li class="page-item"><a class="page-link" href="?page={{ num }}">{{ num }}</a></li> 29 {% endif %} 30 {% endfor %} 31 32 <!-- 次へ の部分 --> 33 {% if page_obj.has_next %} 34 <li class="page-item"> 35 <a class="page-link" href="?page={{ page_obj.next_page_number }}"> 36 <span aria-hidden="true">&raquo;</span> 37 </a> 38 </li> 39 {% else %} 40 <li class="page-item"> 41 <a class="page-link" href="#"> 42 <span aria-hidden="true">&raquo;</span> 43 </a> 44 </li> 45 {% endif %} 46 </ul> 47</div> 48

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

googleで、以下のような語句で検索すると、参考コードも掲載されているページがヒットしますよ。
「ページネーション 事例」
「ページネーション html」

投稿2021/01/01 06:38

_whitecat_22

総合スコア1305

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問