タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

flexboxとレスポンシブに関するe_nagiのブックマーク (1)

  • Flexboxを使ってレスポンシブ対応の「前の記事」「次の記事」リンクを実装

    2016年9月21日 CSS, Wordpress ブログ等の個別記事でよく見かける、「前の記事」「次の記事」へのリンク。これまでも実装方法やスタイリング方法は紹介されてきましたが、Flexboxを使ったらもっと楽に作れちゃうよ!ということで、その方法と、ついでにWordPressでの実装方法も紹介します。 ↑私が10年以上利用している会計ソフト! 1. モバイル用リンクを作成 まずは小さい画面用のリンクを作成します。「モバイルファースト」と呼ばれる手法ですね。前の記事のリンクを上に、次の記事のリンクを下に並べて表示します。ここでは特に込み入った事はしないので、簡単に実装できるはずです。 HTML <div class="prev-next-link"> <a class="prev-link" href="#"> <p class="prev-next-label">前の記事</p> <

    Flexboxを使ってレスポンシブ対応の「前の記事」「次の記事」リンクを実装
  • 1