1.v-form 组件具有 three 功能,可以通过在该组件上设置 ref 来访问它们。 ref 允许我们访问组件上的内部方法,例如 <v-form ref="form">。this.$refs.form.validate() 将验证所有输入并返回所有输入是否有效。 this.$refs.form.reset() 将清除所有输入并重置其验证错误。this.$refs.form.resetValidation() 将仅重置输入验证,而不会更改其状态。
2.<v-navigation-drawer> 导航抽屉
3.<v-overlay>遮罩层
4.打印属性类
    .d-print-none
    .d-print-inline
    .d-print-inline-block
    .d-print-block
    .d-print-table
    .d-print-table-row
    .d-print-table-cell
    .d-print-flex
    .d-print-inline-flex

5. col-x 例如:col-2表示两格
   text-truncate  超出的省略号显示

6.display 对应的值
    .d-{value} for xs
    .d-{breakpoint}-{value} for sm, md, lg and xl

   value属性可以为下列之一
   
    none
    inline
    inline-block
    block
    table
    table-cell
    table-row
    flex
    inline-flex

7.display:none 和visibility:hidden同时可以起到隐藏的总用。
   不同点:visibility:none依然占据空间

8.边距
   {property}{direction}-{size}   例如:mx-2
  property:
   m- 用来设置外边距
   p-用来设置内边距

  direction:指定属性所应用的方向
    
    t - 应用 margin-top 和 padding-top 的间距。
    b - 应用 margin-bottom 和 padding-bottom 的间距。
    l - 适用 margin-left 和 padding-left 的间距。
    r - 应用 margin-right 和 padding-right 的间距。
    s - 应用 margin-left/padding-left (LTR mode) 和 margin-right/padding-right (RTL mode)
    e - 应用 margin-right/padding-right (LTR model) 和 margin-left/padding-left (RTL model)
    x - 同时对应*-left和*-right属性
    y - 同时对应*-top和*-bottom属性
    a - 在所有方向应用该属性的间距。
 size:
    0 - 消除所有 margin 或者 padding 并设置为 0
    1 - 设置 margin 或者 padding 到 4px
    2 - 设置 margin 或者 padding 到 8px
    3 - 设置 margin 或者 padding 到 12px
    4 - 设置 margin 或者 padding 到 16px
    5 - 设置 margin 或者 padding 到 20px
    6 - 设置 margin 或者 padding 到 24px
    7 - 设置 margin 或者 padding 到 28px
    8 - 设置 margin 或者 padding 到 32px
    9 - 设置 margin 或者 padding 到 36px
    10 - 设置 margin 或者 padding 到 40px
    11 - 设置 margin 或者 padding 到 44px
    12 - 设置 margin 或者 padding 到 48px
    n1 - 将负的 margin 设置到 4px
    n2 - 将负的 margin 设置到 8px
    n3 - 将负的 margin 设置到 12px
    n4 - 将负的 margin 设置到 16px
    n5 - 将负的 margin 设置到 20px
    n6 - 将负的 margin 设置到 24px
    n7 - 将负的 margin 设置到 28px
    n8 - 将负的 margin 设置到 32px
    n9 - 将负的 margin 设置到 36px
    n10 - 将负的 margin 设置到 40px
    n11 - 将负的 margin 设置到 44px
    n12 - 将负的 margin 设置到 48px
    auto - 设置边距为 auto
 设置竖直水平居中:class="mx-auto my-auto px-auto"

9.purple 紫色 
  darken-         例如:darken-2
  text-"value"      里面有  left  center right bottom top
  text--"颜色" 例如:text--white

10.elevation  海拔  0-24分25个级别

11.#pannel {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
}
 在vuetify中可以定义为 d-flex flex-row
 
  基本的类有:
    .d-flex
    .d-inline-flex
    .d-sm-flex
    .d-sm-inline-flex
    .d-md-flex
    .d-md-inline-flex
    .d-lg-flex
    .d-lg-inline-flex
    .d-xl-flex
    .d-xl-inline-flex

12.v-ripple 波纹

 <div
    v-ripple
    class="text-center elevation-2 pa-12 headline"
  >
    HTML element with v-ripple
  </div>

  (2)  v-ripple="{ center: true }"

vuetify 属性集合的更多相关文章

  1. Spring中使用Map、Set、List、数组、属性集合的注入方法配置文件

    (1)下边的一个Java类包含了所有Map.Set.List.数组.属性集合等这些容器,主要用于演示spring的注入配置: package com.lc.collection; import jav ...

  2. 【JVM虚拟机】(7)---深入理解Class中-属性集合

    #[JVM虚拟机](7)---深入理解Class中-属性集合 之前有关class文件已经写了两篇博客: 1.[JVM虚拟机](5)---深入理解JVM-Class中常量池 2.[JVM虚拟机](6)- ...

  3. 属性集合java.util.Properties

    属性集合java.util.Properties java.util.Properties集合 extends Hashtable<k, v> implements Map<k, v ...

  4. css3的3d属性集合

    css3的3d属性集合 想进入css3的3d世界必须知道一下几个属性及其用法. 当然在进入属性介绍之前我想你必须知道3维坐标,附上一张经典图如下: 我想不用解释了吧.之后要平移和旋转都是在这个基础之上 ...

  5. Android GridView属性集合

    GridView的一些特殊属性: 1.android:numColumns=”auto_fit”   //GridView的列数设置为自动 2.android:columnWidth=”90dp &q ...

  6. UITableView 属性集合

    UITableView-------表视图--继承UIScrollView并遵守NSCoding协议 属性 frame-------------设置控件的位置和大小 backgroundColor-- ...

  7. android之View组件的XML属性集合

    XML属性 相关方法 说明 android:alpha setAlpha(float) 设置该组件的透明度 android:background setBackgroundResource(int) ...

  8. easyui 属性集合

    easyUI属性汇总 属性分为CSS片段和JS片段. CSS类定义:1.div easyui-window 生成一个window窗口样式. 属性如下: 1)modal:是否生成模态窗口.true[是] ...

  9. HTML表单属性集合

随机推荐

  1. PyQt(Python+Qt)实现的GUI图形界面应用程序的事件捕获方法大全及对比分析

    一. 概述 PyQt的图形界面应用中,事件处理类似于Windows系统的消息处理.一个带图形界面的应用程序启动后,事件处理就是应用的主循环,事件处理负责接收事件.分发事件.接收应用处理事件的返回结果, ...

  2. 手写mini版MVC框架

    目录 1, Springmvc基本原理流程 2,注解开发 编写测试代码: 目录结构: 3,编写自定义DispatcherServlet中的初始化流程: 3.1 加载配置文件 3.2 扫描相关的类,扫描 ...

  3. 安装nginx并安全地配置和启动

    一.安装nginx >>参考文章<< 安装教程,看代码&注释 # .sh # 如果centos服务器是最低安装,则先安装weget yum install -y wge ...

  4. Luogu-P3205-HNOI2010-合唱队

    题目地址 思路 这道题其实是P3146 [USACO16OPEN]248的升级版,但是N的范围很大,为262144.原先的O(N3)的方法自然会TLE,甚至O(N2)的方法也不足以解决. 定义f[i] ...

  5. 题解-[SDOI2017]数字表格

    题解-[SDOI2017]数字表格 前置知识: 莫比乌斯反演</> [SDOI2017]数字表格 \(T\) 组测试数据,\(f_i\) 表示 \(\texttt{Fibonacci}\) ...

  6. js上 十八、字符串

    十八.字符串 #18.1.认识字符串 #什么是字符串 字符串可以是引号中的任意文本.字符串可以由双引号(")或单引号(')表示 ,如 'hello' , "中国" #为什 ...

  7. 网络编程-python实现-TCP(1.1.3)

    @ 目录 1.TCP是什么 2.代码实现 1.TCP是什么 传输控制协议(TCP,Transmission Control Protocol)是一种面向连接的.可靠的.基于字节流的传输层通信协议,由I ...

  8. UWP ListView添加不同样式

    先看效果: 使用ListView的ItemTemplateSelector <ListView IsItemClickEnabled="True" ItemContainer ...

  9. 最火的分布式调度系统 XXL-JOB 安装和简单使用

    唉,在谈文章之前先说一下自己的情况.原计划是在上周六写完这篇文章的,然而周六的时候打开电脑的,按照平常"惯例",先补一些 "黑色五叶草"/"进巨&qu ...

  10. QEMU网络模式(一)——bridge

    网络配置 QEMU支持的网络模式 qemu-kvm主要向客户机提供了4种不同模式的网络. 1)基于网桥(bridge)的虚拟网卡; 2)基于NAT的虚拟网络 3)QEMU内置的用户模式网络(user ...