サルでもわかるWEBプログラミング

Bulmaを利用したサイトのためのテンプレートファイルを以下に作りましたので、もしよろしければお使いください。

https://github.com/adash333/bulma-test

上記ファイルは、実際は以下のような表示となります。

https://adash333.github.io/javascript-test/bulma-template.html

なぜかはよく分からないのですが、CSSフレームワークBulmaを用いる場合は、以下のように、最初にsection class=“section”とdiv class=“container”で囲んでおくと、思ったようなデザインにできることが多いです。

<section class="section">
  <div class="container">
    <!-- ここにコンテンツを記載 -->
  </div>
</section>

https://github.com/adash333/bulma-test

ボタンButtonとカラムColumns

題名(ヒーロー、Hero)

フォーム

ヘッダー

フッター

テーブル

パネル

https://bulma.io/documentation/components/panel/

https://misc.laboradian.com/bulma/sample1/
Bulma sample

https://dansup.github.io/bulma-templates/

https://saruwakakun.com/html-css/basic/css
初心者向けCSS（スタイルシート）入門：基本的な書き方を総まとめ！
2017/07/1

https://bulma.io/documentation/