Bootstrap 5の作業環境の構築方法、依存関係のインストール手順、ページやコンポーネントの実装、jQueryを使用せずにシンプルなJavaScript(バニラJS)でコンポーネントを実装する方法などを紹介します。 Bootstrap 5 tutorial: learn how to get started without jQuery by @zolidev 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに Bootstrap 5の作業環境を用意する方法 npm依存関係のインストール Sassファイルをコンパイルするためのgulpfileを作成し、BrowserSync経由でローカルサーバーを作成 BootstrapのSassファイルをワークフローに含める 新しいマークアップで簡単なブログページを作成する ナビゲー
商用のプロジェクトでも無料で利用できる、管理画面・ダッシュボードのレイアウトやUIコンポーネントが揃ったテンプレートを紹介します。 このテンプレートを使用すると、管理画面・ダッシュボードで必要なコンテンツを簡単に作成できます。 Stisla 管理画面・ダッシュボードに特化されたUIコンポーネントがほとんどすべて揃ったテンプレート。 30以上のサードパーティのライブラリと統合、多くのコンポーネントを簡単に利用できます。 HTML5とCSS3で記述されており、すべてのモダンブラウザでサポートされています。 Bootstrap 4をベースに、Flexboxでレイアウトされています。 一部のコンポーネントにはより簡単にやり取りするために、JavaScript APIを使用。 MITライセンスで、商用プロジェクトでも無料で利用できます。
Bootstrap 4のナビゲーションバーのカラーを変更したり、アイテムを整列させたり、レスポンシブのブレークポイントを変更するなどのカスタマイズ方法、ナビゲーションバーのいろいろなデザインの実装例を紹介します。 Bootstrap Navbar Guide and Free Navigation Examples by Nataly Birch 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 ナビゲーションの重要性 Botostrapのナビゲーションバーとは Bootstrapのナビゲーションバーのカラーを変更する方法 Bootstrapのナビゲーションバーのアイテムを整列する方法 Bootstrapのナビゲーションバーのブレークポイントを変更する方法 Bootstrapのナビゲーションバーのいろいろなデザインの実装例 終わり
Luxeritas WordPress Theme は、SEO 最適化済み、レスポンシブ、 高カスタマイズ性を持つ無料の WordPress テーマです。 また、多機能であるにも関わらず、 Webページを高速に表示するための仕組みが満載されており、非常に高速に動作します。 名前はラテン語の Lux(光)と Celeritas(速)のガッチャンコ形。 Luxeritas テーマの特徴とはLuxeritas の開発において、特に重視しているのは、 高速化、SEO、レスポンシブ、多機能、に関する取り組みです。 高速化に関する取り組み・Google Pagespeed Insights によるスコア ・Lighthouse(Audits) によるスコア 詳しくは Lighthouse による監査方法 をご覧ください。 ・GTmetrix によるスコア HTML、CSS、Javascript を静的
Bootstrapは既に多くの人が知っていると思います。 では、Bootstrapで採用されているCSSのリセットは知っていますか? Reset CSSやNormalize.cssよりも使いやすく、これからのWebサイトやスマホアプリのCSSリセットとして設計された「Reboot.css」の特徴と使い方を紹介します。 A Look at Bootstrap 4's New Reset: Reboot.css 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 Reboot.cssとは Reboot.cssの使い方 「box-sizing: border-box;」がどのように定義されているか remを使用したサイズとスペースの指定 ネイティブのフォントファミリー margin-topは死んでいる 共通要素はクリーンなスタイル タッチ
短時間で手軽にウェブサイトを作成できるCSSフレームワークは、数多く公開されています。CSSフレームワークを使用することで、開発速度をスピードアップさせるだけでなく、クリーンで規則性のあるレイアウトを時間をかけずに作成できます。 今回はたくさんあCSSフレームワークの中から、特に人気の高いものを中心に、高機能で使い勝手の良いものから、無駄を一切省いた超軽量なものまで、最新CSSフレームワークをまとめてご紹介します。目的やデザインの好みなど、自分にあった使いやすいフレームワークを見つけてみてはいかがでしょう。 ウェブサイト開発を爆速に!人気オススメCSSフレームワーク厳選まとめ【2018年保存版】 Bulma Flexbox をベースにしたCSSフレームワーク。軽量で用意されたひとつのCSSファイルを読み込むだけの手軽さも人気の理由。 URL: https://bulma.io/ CDN:
さくっと短時間で、慣れれば1分! デスクトップやスマホに対応したページを作成したい時にぴったりな無料のオンラインツールを紹介します。 HTMLやCSSの作業は一切不要で、Bootstrap 4ベースのさまざまなページをドラッグ&ドロップで積み木のように組み合わせて簡単に作成できます。 Froala Design Blocks Froala Design Blocks -GitHub Froala Design Blocksでは170種類以上のレスポンシブ対応のコンポーネントが用意されており、それらを好きなように組み合わせて、誰でも簡単にWebページを作成することができます。 作成したページは個人でも商用でも無料。詳しくはライセンスページをご覧ください。 短時間で、Bootstrap 4ベースのページを作成してみる 用意されているコンポーネント 短時間で、Bootstrap 4ベースのページ
Bootstrap 4.0のテンプレートやコンポーネントのデザインを確認しながら、定義されている変数を簡単にカスタマイズできるオンラインツールを紹介します。 BootstrapでWebサイトやブログを作成する時に、BootstrapのUIコンポーネントを利用する時に、Bootstrapのテーマを作成する時に、便利なオープンソースの無料ツールです。 Bootstrap Magic Bootstrap Magic -GitHub Bootstrap Magicの特徴 Bootstrap Magicの使い方 Bootstrap Magicの特徴 Bootstrap 4.0対応 最新のBootstrap 4.0のすべてのテンプレート・コンポーネントに対応しています。 Sass対応 BootstrapはSassにも対応しているので、Bootstrap Magicでも同様にSassの変数が利用できます
2017年8月にBootstrap 4はようやくベータ版がリリースされました。 そんなBootstrap 4に早くも対応した、Bootstrapのさまざまなテンプレートを簡単にカスタマイズして利用できるオンラインサービスを紹介します。 Webサイト、ランディングページ、ブログのテンプレートをはじめ、ナビゲーションやカード型コンポーネントなど、さまざまなテンプレートを利用できます。 日本人クリエイターによる国産のツールで、先日Bootstrap 4 betaにも対応されました。 Bootstrap4 Editor Bootstrap4 Editorの特徴 Bootstrap4 Editorの機能 Bootstrap4 Editorの使い方 Bootstrap4 Editorの特徴 Bootstrapを初心者でも手軽に使えるよう開発された日本製のオンラインツールで、ダウンロードやインストールな
We're a passionate team of frontend developers, united by our love for coding and open source. Founded in 2017, Epicmax quickly became known for our deep dive into open source with a sharp focus on Vue.js, marking our expertise in the domain. With 8+ years of Vue.js expertise, we’ve explored every corner of the ecosystem and become trusted partners of its leaders: Vuetify, PrimeVue, and VueJobs. F
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く