classを利用しないnoクラスのCSSフレームワーク「sakura」を使用する手順

classを利用しないnoクラスのCSSフレームワーク「sakura」を使用する手順

bootstrapのようにclassを利用してデザインを適応するのとは違い、読み込むだけで対応するタグにスタイルを適応していく、classを利用しないnoクラスと呼ばれるタイプのCSSフレームワーク「sakura」の導入手順を記述してます。

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43

※windows10にApacheのインストールはこちら

HTML作成

まずは通常のhtmlを作成してみます。

レイアウト結果

sakura導入

作成したhtmlに「sakura」を適応してみます。作成したhtmlに以下を追加するだけ利用できます。

さきほどのコードに追加してみます。

レイアウトが適応されていることが確認できます。