okuden-labo
12/7/2017 - 9:07 AM

bulmaを使った便利なブロック(1)

bulmaを使った便利なブロック(1) -PCで画像の右揃え、左揃え、モバイルで画像の中央揃え-


<div class="container">
  <div class="columns">
    <div class="column has-text-centered-mobile is-one-third">
      <img src="https://placehold.jp/400x250.png">
    </div>
    <div class="column">
      この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。
    </div>
  </div>
  <div class="columns">
    <div class="column">
      この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。この文章はダミーテキストです。文字の大きさ・字間・行間などを確認するために入れています。
    </div>
    <div class="column has-text-centered-mobile is-one-third">
      <img src="https://placehold.jp/400x250.png">
    </div>
  </div>
</div>