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

フリーソフトのみでホームページ作成

ユーザ用ツール

サイト用ツール


00.vue用デザインフレームワークvuetify:05.vuetifyでheaderヘッダーとfooterフッター


差分

このページの2つのバージョン間の差分を表示します。

この比較画面にリンクする

両方とも前のリビジョン 前のリビジョン
次のリビジョン
前のリビジョン
00.vue用デザインフレームワークvuetify:05.vuetifyでheaderヘッダーとfooterフッター [2019/01/29]
adash333 [Vue.jsにMaterial Design Iconを導入]
00.vue用デザインフレームワークvuetify:05.vuetifyでheaderヘッダーとfooterフッター [2019/04/30] (現在)
adash333 [レスポンシブtoolbarとfooter]
行 53: 行 53:
  
  
- 
- 
-途中。 
  
 ===== Vuetifyでレスポンシブなヘッダー(toolbar)その2 ===== ===== Vuetifyでレスポンシブなヘッダー(toolbar)その2 =====
行 168: 行 165:
 ==== Vue.jsにMaterial Design Iconを導入 ==== ==== Vue.jsにMaterial Design Iconを導入 ====
 Material IconsとMaterial Design Iconsは別物らしく、公式サイトにmdi-codepenと記載されているアイコンは、Material Design Iconsだそうなのですが、そのままでは表示されません。 Material IconsとMaterial Design Iconsは別物らしく、公式サイトにmdi-codepenと記載されているアイコンは、Material Design Iconsだそうなのですが、そのままでは表示されません。
-https://vuetifyjs.com/ja/framework/iconsを見て、Material Design Iconsをインストールしようとしましたが、私の実力ではうまくいきませんでした。仕方がないので、vue-material-design-iconsを使用してみたいと思います。+https://vuetifyjs.com/ja/framework/iconsを見て、Material Design Iconsをインストールしようとしましたが、私の実力ではうまくいきませんでした。(かなりググったのですが、Vuetifyで、デフォルトのMaterial Iconsに加えて、Material Design Iconsを同時に使用する方法が分かりませんでした。)仕方がないので、vue-material-design-iconsを使用してみたいと思います。
  
   -Add Dependencyからvue-material-design-iconsをインストール   -Add Dependencyからvue-material-design-iconsをインストール
行 186: 行 183:
  
 // script内 // script内
-import MenuIcon from "vue-material-design-icons/Codepen.vue"+import CodepenIcon from "vue-material-design-icons/Codepen.vue"
    
 components: { components: {


00.vue用デザインフレームワークvuetify/05.vuetifyでheaderヘッダーとfooterフッター.1548795270.txt.gz · 最終更新: 2019/01/29 by adash333