cssフレームワークbulmaでwebデザイン:index.html
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン | ||
cssフレームワークbulmaでwebデザイン:index.html [2018/12/06] – [CDNを用いてBulmaを用いる方法] adash333 | cssフレームワークbulmaでwebデザイン:index.html [2018/12/07] (現在) – 削除 adash333 | ||
---|---|---|---|
行 1: | 行 1: | ||
- | ===== CSSフレームワークBulmaでWEBデザイン ===== | ||
- | |||
- | ==== CDNを用いてBulmaを用いる方法 ==== | ||
- | |||
- | htmlファイルの< | ||
- | |||
- | < | ||
- | <link rel=" | ||
- | </ | ||
- | |||
- | ちょっと面倒ですが、以下のように入力すると、パソコンではボタンが横並びに表示され、スマホでは縦並びにボタンが表示されます。 | ||
- | |||
- | < | ||
- | < | ||
- | < | ||
- | < | ||
- | <meta charset=" | ||
- | <meta name=" | ||
- | <link rel=" | ||
- | <script defer src=" | ||
- | </ | ||
- | < | ||
- | <div class=" | ||
- | <div class=" | ||
- | <div class=" | ||
- | <p class=" | ||
- | </ | ||
- | <div class=" | ||
- | <p class=" | ||
- | </ | ||
- | <div class=" | ||
- | <p class=" | ||
- | </ | ||
- | </ | ||
- | </ | ||
- | </ | ||
- | </ | ||
- | </ | ||
- | |||
- | 実際の表示 | ||
- | |||
- | https:// | ||
- | |||
- | 参考 | ||
- | |||
- | セクション: | ||
- | https:// | ||
- | |||
- | カラム: | ||
- | https:// | ||
- | |||
- | ノーティフィケーション: | ||
- | https:// | ||
- | |||
- | 文字のセンタリング: | ||
- | https:// | ||
- | |||
- | |||
- | |||
- | ===== Bulma日本語リンク ===== | ||
- | 公式サイトも、日本語での紹介サイトも、結構不親切なものが多いと感じます。 | ||
- | |||
- | サンプルコードを写経しながら、[[https:// | ||
- | |||
- | https:// | ||
- | @ochiochi | ||
- | 2017年02月13日に更新 | ||
- | CSSフレームワーク BULMA チュートリアル① | ||
- | |||
- | |||
- | https:// | ||
- | |||
- | ===== Bulma英語解説リンク ===== | ||
- | |||
- | https:// | ||
- | |||
- | 英語ですが、分かりやすいですし、Scrimbaというサイトを用いて、動画での解説と、ソースコードも公開されていて素晴らしいです。 | ||
- | |||
- | https:// | ||
- | Bulmaの使用方法について、動画での詳しい解説(Scrimbaの仕組みのおかげでソースコードも簡単にコピペできます。) | ||
- | |||
- | |||
- | Scrimba | ||
- | |||
- | 無料で、プログラミング解説動画を作成できるサイト | ||
- | |||
- | 解説:https:// | ||
- | |||
- | CodeSandbox | ||
- | |||
- | 無料でAngularやVue.jsのプログラミングができるサイト | ||
- | |||
- | 解説:https:// | ||
- | |||
- | |||
- | |||
- | ===== Bulmaのサンプルソースコードのリンク ===== | ||
- | |||
- | https:// | ||
- | 英語ですが、順番に説明があって、分かりやすいです。 | ||
- | |||
- | |||
- | https:// | ||
- | |||
- | |||
- | |||
- | https:// | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | ===== Vue.jsとBulmaに関するリンク ===== | ||
- | |||
- | http:// | ||
- | Vue.js(nuxt.js)内でのBulma-extention(Bulma-carousel)の使い方 | ||
- | 2018-10-10 投稿者: miho | ||
- | |||
- | |||
- | https:// | ||
- | |||
cssフレームワークbulmaでwebデザイン/index.html.1544103359.txt.gz · 最終更新: 2018/12/06 by adash333