Bootstrap

Swiper.jsとBootstrapでレイアウトが崩れた時の話

• 2020.12.19
• CSS JavaScript
• Bootstrap, Swiper.js

Bootstrapのrowとcolを使ったレイアウトの中でSwiper.jsを使おうとしたら、幅がおかしくなった。 現象 rowの中にcolを３つ入れて、横並びレイアウトをしていて、そのcolの中にSwiper.jsを入れたら、そのcolが横幅いっぱいに広がってしまった。 原因 flex関連の干渉が原因？ 解決方法 以下のように、swiper-wrapperのpositionをabsoluteにす […]

続きを読む

npmでBootstrapをインストールしてWebpackでコンパイルする方法（同時にjQueryも）

• 2020.05.18
• CSS JavaScript
• Bootstrap, css, jQuery, node.js, npm, Webpack, コンパイル

ホームページを作る時、BootstrapとJQueryを使う機会が多いんですが、今までは、それぞれのCDNから読み込んで使っていました。 今回は、npmを使ってプロジェクトに直接インストールしてみます。Bootstrapは、JQueryに依存しているので、JQueryも一緒にインストールします。 全体的な流れとしては、 ・node.js（npm）のインストール ・webpackの導入 ・Boots […]

続きを読む