离线使用Element UI和Vue

需要依赖如下:

1.vue.js;

2.index.js(Element UI)

3.index.css(Element UI)

4.element-icons.ttf(Element UI字体)

5.element-icons.woff(Element UI图标)

下载链接如下:

链接:https://pan.baidu.com/s/1nGOi0Vm_xExRGmVp6oVLoA 
提取码:b7f5

项目目录如下:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./index.css">
</head>

<body>
    <div id="app">
        <el-row>
            <el-button>默认按钮</el-button>
            <el-button type="primary">主要按钮</el-button>
            <el-button type="success">成功按钮</el-button>
            <el-button type="info">信息按钮</el-button>
            <el-button type="warning">警告按钮</el-button>
            <el-button type="danger">危险按钮</el-button>
        </el-row>
        <el-row>
            <el-button icon="el-icon-search" circle></el-button>
            <el-button type="primary" icon="el-icon-edit" circle></el-button>
            <el-button type="success" icon="el-icon-check" circle></el-button>
            <el-button type="info" icon="el-icon-message" circle></el-button>
            <el-button type="warning" icon="el-icon-star-off" circle></el-button>
            <el-button type="danger" icon="el-icon-delete" circle></el-button>
        </el-row>
    </div>
</body>
<script src="./vue.js"></script>
<script src="./index.js"></script>
<script>
    new Vue({
        el: "#app"
    })
</script>
<style>
    @font-face {
        font-family: element-icons;
        src: url(./element-icons.woff) format('woff'), url(./element-icons.ttf) format('truetype');
        font-weight: 400;
        font-style: normal;
    }
</style>

</html>

浏览器运行效果: 

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/361277.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Django问题报错:Cannot resolve keyword ‘name‘ into field. Choices are: course, id

笔者在进行登录注册实验用户名已经注册过的操作时报错 一、错误位置 二、问题原因 使用Student模型时参数名错误 三、解决办法 修改为与Student模型中对应的参数名,问题解决

Cache Lab:Part A【模拟出使用LRU策略的高速缓存存储器组织结构】

目录 任务描述 知识回顾 实验内容 测试结果 Cache Lab 对应《CS:APP》6.3节至第六章结束的内容。 任务描述 Your job for Part A is to fill in the csim.c file so that it takes the same command line arguments and produces the identical output as the reference …

0131-2-关于事件捕获和冒泡

关于事件捕获和冒泡 DOM事件流分为三个阶段&#xff1a;捕获阶段、目标阶段、冒泡阶段 点击目标元素后&#xff0c;不会马上触发目标元素&#xff0c;而是先执行事件捕获&#xff0c;从顶部逐步到目标元素&#xff1b;处于目标阶段的时候触发目标元素&#xff1b;最后冒泡阶段…

性能测试工具架构

背景 性能测试工具&#xff08;LoadRunner为例&#xff09; 性能测试工具通常是指那些用来支持压力、负载测试&#xff0c;能够录制和生成脚本、设置和部署场景、产生并发用户和向系统施加持续压力的工具。 性能测试工具录制的是服务端与应用之间的通信数据&#xff0c;而不是…

如何快速知道app当前页面是哪一个Activity(2.0升级版)

点我跳转 如何快速知道app当前页面是哪一个Activity 1.0版本 这个版本是用adb 命令实现的&#xff0c;想看的可以看看&#xff0c;学习一下adb 命令。 今天做了一个非常简易的app来直接监控当前页面Activity&#xff0c;效果直接炸裂&#xff0c;效果图如下&#xff1a; 有需要…

【学习资源】分享一个文献互助平台(CRS核心论文库)

博主在之前的博文中推荐过三个文献互助平台&#xff08;科研通、谷粉、纬度&#xff09;https://blog.csdn.net/dave496206/article/details/135604252?spm1001.2014.3001.5501 博主在这里再补充一个文献互助或下载平台——CRS核心论文库 1、CRS核心论文库首页&#xff1a; …

突破瓶颈!程序员最值得关注的19个顶级油管博主

油管可以说是互联网上最有趣的地方&#xff0c;你可以在这里找到任何你感兴趣的东西。这里也是学习和探索编程世界的绝佳方式。有趣又有才华的技术博主非常多&#xff0c;随时随地都可以与全世界的开发者交流学习。 我们整理了一些在编程领域有影响力的博主&#xff0c;希望能给…

SpringBoot项目logback日志配置

Session 认证和 Token 认证 过滤器和拦截器 SpringBoot统一返回和统一异常处理 SpringBoot项目logback日志配置 程序运行出现错误时&#xff0c;第一时间想到的是甩锅还是日志&#xff1f;通过查看日志定位出问题的位置&#xff0c;才能更好的甩锅&#xff0c;今天就来学习…

配置vite自动按需引入 vant 组件

为什么学 按需加载可以减少包体积,优化加载性能 学习内容 全局注册组件 import 需要的组件import 组件样式使用 app.use 注册组件 Tree Shaking 介绍使用 什么是 tree shaking&#xff1f; Tree shaking是一种优化技术&#xff0c;用于减少JavaScript或其他编程语言中未被使用…

fullcalendar案例

fullcalendar案例 <script srchttps://cdn.jsdelivr.net/npm/fullcalendar6.1.10/index.global.min.js></script><script srchttps://code.jquery.com/jquery-3.6.0.min.js></script> <!-- 引入 jQuery CDN --><script>document.addEventL…

虚拟机VMware vCneter告警:Log DIsk Exhaustion on frvc70,vCenter日志清理

其中frvc70是主机名称 1.告警原因 Troubleshooting vCenter Appliance /storage/log directory is 80% or more ful 当分区/storage/log使用率达到 80% 时&#xff0c;会触发此告警。 2.解决方法 1.通过 SSH 或通过 vCenter 虚拟机控制台连接到 vCenter Server Appliance …

Halcon 几何测量

文章目录 算子Halcon 计算两点之间的距离案例Halcon 计算点到直线的距离Halcon 计算点到区域的距离Halcon 线到区域的距离Halcon 线到线的距离 算子 distance_pp 两点之间的距离算子 distance_pp( : : Row1, Column1, Row2, Column2 : Distance) Row1 点1的行坐标 Column1 点1的…

[ESP32]在Thonny IDE中,如何將MicroPython firmware燒錄到ESP32開發板中?

[ESP32 I MicroPython] Flash Firmware by Thonny(4.1.4) IDE 正常安裝流程&#xff0c;可參考上述影片。然而&#xff0c;本篇文章主要是紀錄安裝過程遇到的bug, 供未來查詢用&#xff0c;也一併供有需要的同好參考。 問題:安裝後&#xff0c;Thonny互動介面顯示一堆亂碼和co…

网安人必看!CISP家族顶流证书攻略

网络安全已成为当今的热门领域&#xff0c;证书在职业发展中的重要性不言而喻。但是&#xff0c;证书市场五花八门&#xff0c;选择适合自己的证书可是个大问题。别担心&#xff0c;今天我们就来聊聊CISP家族的几个热门认证&#xff0c;让你在网络安全领域的发展更加顺利&#…

ADI 配合 USRP 使用的相控阵天线 cn0566

相控阵天线 在这里插入图片描述

IDEA快捷键大全

提示&#xff1a; ① 主要记录我在使用 IDEA 开发的过程中用到的快捷键&#xff0c;可以提高开发速度。 ② 不一定要全部记住&#xff0c;主要是当一个参考文档&#xff0c;大家有一点印象&#xff0c;随时可以查看。 参考博客 > IntelliJ IDEA 快捷键说明大全&#xff08;官…

Springboot+vue的健身房管理系统(有报告)。Javaee项目,springboot vue前后端分离项目

演示视频&#xff1a; Springbootvue的健身房管理系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot vue前后端分离项目 项目介绍&#xff1a; 本文设计了一个基于Springbootvue的前后端分离的健身房管理系统&#xff0c;采用M&#xff08;model&#xf…

WPF图表库LiveChart异常问题处理-System.ArgumentOutOfRangeException:指定的参数超出了有效值的范围

问题&#xff1a; 在使用liveChart处理一个以时间为X轴的曲线时&#xff0c;遇到一个报错&#xff1a;指定的参数超出了有效值的范围System.ArgumentOutOfRangeException:“Specified argument was out of the range of valid values. Arg_ParamName_Name” 指定的参数超出了有…

YOLOv5源码逐行超详细注释与解读(1)——项目目录结构解析

前言 前面简单介绍了YOLOv5的网络结构和创新点&#xff08;直通车&#xff1a;【YOLO系列】YOLOv5超详细解读&#xff08;网络详解&#xff09;&#xff09; 在接下来我们会进入到YOLOv5更深一步的学习&#xff0c;首先从源码解读开始。 因为我是纯小白&#xff0c;刚开始下…

EXCHANGE PARTITION 方法处理(挽救)大型分区表中的块损坏的步骤

当在巨大的表分区块&#xff08;例如 ORA-01578&#xff09;中发现损坏时&#xff0c;并且我们没有备份&#xff08;例如 RMAN、操作系统级别、导出或任何外部资源&#xff09;来恢复损坏&#xff0c;我们仍然可以尝试挽救使用 10231 事件处理表中的剩余数据&#xff08;由于跳…
最新文章