栀子z 2019-03-08 21:50 采纳率: 0%
浏览 892

通过script的方式引入类似于mint-ui 还有 mui的组件库，组件会变小

我的项目是vue做的移动但是没有用脚手架在引入mint-ui 或者是mui的时候所有组件都会变小，像这样!图片说明在移动端太小了没法用怎么处理？望有大神帮忙
，不胜感激。

  • 写回答

1条回答 默认 最新

  • 你知我知皆知 2024-08-08 05:58
    关注

    以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

    要解决这个问题，你需要修改你的Vue应用的样式。首先，在你的<style>标签中添加一些CSS规则来控制组件大小。

    1. 在你的<head>部分加入以下代码：
    <style>
  .mixin {
    width: 100px;
    height: 100px;
  }
</style>

    这将使所有<div>元素（包括<template>和<script>元素）具有宽度和高度为100像素的固定尺寸。请注意，如果你的<template>或<script>元素包含动态计算的宽度/高度，你可能需要使用width和height属性而不是max-width和max-height。

    1. 在你的<body>部分加入以下代码：
    <body class="mixin">
  <!-- your components here -->
</body>

    这将在整个页面上应用上述CSS规则。

    现在，当你的Vue应用加载时，所有的组件应该以正确的尺寸显示出来。如果仍然遇到问题，请检查你的HTML结构和JavaScript代码是否正确设置组件的宽度和高度。

    评论

报告相同问题？

  • 前端组件库 - 搭建web app常用的样式/组件等收集列表(移动优先)
    2018-06-28 09:59
    weixin_34014555的博客 0. 前端自动化(Workflow) 前端构建工具 Webpack - module bundler Yeoman - a set of tools for automating development workflow gulp - The streaming build system use-gulp grunt - the...
  • 前端组件库
    2019-01-18 15:03
    chuming03403的博客 前端组件库 搭建web app常用的样式/组件等收集列表(移动优先) 一个常用的PHP类库, 资源以及技巧列表 awesome-php 推荐 0. 前端自动化(Workflow) 前端构建工具 Webpack - module bundler Yeoman - a set of ...
  • 你不知道的前端框架和UI组件库 - 大合集【收藏必备】
    2023-07-13 16:36
    Qianmo_er的博客 Vue.js 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。...学习和使用 ReactJS，你并不需要对你现有的代码架构做太大的调整，只要引入 react.js 和 react-dom.js 两个文
  • 前端组件、插件汇总
    2018-09-12 09:52
    弹琴弹琴的博客 0. 前端自动化(Workflow)   前端构建工具     Webpack - module bundler Yeoman - a set of tools for automating development workflow gulp - The streaming build system use-gulp grunt - ...
  • 前端面试35k题库2021-@莫成尘
    2021-07-28 10:08
    莫成尘的博客 Web前端面试题宝典【精编版】 过了八月，马上到了金九银十的跳槽季，找工作的时候曾一周面试了十多家公司，从一开始被面试官虐的体无完肤到最后对答如流，过程中经历了多少挑灯夜战的晚上，恶补前端知识，努力的...
  • Web前端热门框架大全
    2019-11-16 19:46
    邻家老龚2333的博客  Vue.js通过组件，把一个单页应用中的各种模块拆分到一个一个单独的组件（component）中，我们只要先在父级应用中写好各种组件标签（占坑），并且在组件标签中写好要传入组件的参数（就像给函数传入参数一样，这个...
  • vue 官方推荐的好用的三方库
    2020-12-31 21:47
    桃根仙的博客 自述文件 非常棒的存储库徽标 ...UI组件 表 通知 装载机 进度条 工具提示 覆盖 视差 图示 选框 菜单 减号加输入 轮播 图表 时间 日历 地图 音频视频 无限滚动 拉到刷新 降价促销 PDF格式 树 图形
  • 前端小总结1
    2020-02-19 11:31
    随风飘游的博客 父组件向子组件传递数据通过prop，子组件传递数据是父组件通过$emit触发事件来做到的 父组件parent和子组件child 1.父组件传递了message数据给子组件 props : [ 'message' ] , 通过v - on绑定一个...
  • ❤️❤️❤️前端成神之路必看学习资源（二），建议收藏起来，偷偷学习！！！❤️❤️❤️
    2021-06-09 11:52
    凯小默的博客 淘系前端校招负责人元彦直播答疑文字实录 业务前端的困境 深入系列目录 JavaScirpt深入之从原型到原型链 JavaScript深入之词法作用域和动态作用域 JavaScript深入之执行上下文栈 JavaScript深入之变量对象 ...
  • Vue学习
    2019-01-10 16:24
    TONKIA的博客 首先需要引入新的库 vue-resource 还可以使用 axios 常用的数据请求类型：get、post、jsonp 为什么要使用jsonp 跨域的安全限制都是对浏览器端来说的，服务器端是不存在跨域安全限制的。 如果协议，端口...
  • Vue寒假学习笔记
    2022-02-11 14:55
    @追求卓越的博客 mui-button组件就是一个vue组件,我们在这里就可以看见了 就是按需导入:(选择整个组件文件,并选择导入Button) import { Button } from 'mint-ui'; Vue.use(Button) 全局导入: import Mint from 'mint-ui' import '...
  • webpack打包实战
    2019-08-02 16:20
    weixin_44387746的博客 在网页中会引用哪些常见的静态资源？ JS .js CSS .css .less .sass .scss Images .jpg .png .gif .svg 字体文件（Fonts） .svg .ttf .eot .woff .woff2 网页中引入的静态资源多了以后有什么问题？？...
  • 《Vue入门篇之常用知识汇总》
    2020-10-24 15:30
    yk-ddm的博客 官方规定组件里面的data必须是一个函数function 视图层 在Vue实例中，获取data上的数据，通过this.数据属性名，获取方法，通过this.方法名，this代表实例 基础 历史介绍 angular框架–09年 react–2013年，用户体验...
  • 安装webpack上
    2018-11-22 17:21
    今天你好、阳光正好的博客 npm WARN deprecated coffee-script@1.7.1: CoffeeScript on NPM has moved to "coffeescript" (no hyphen) C:\Users\admin\AppData\Roaming\npm\nrm -> C:\Users\admin\AppData\Roaming\npm\node_modules\nrm\cli....
  • Vue 基础知识笔记
    2019-10-02 15:58
    weixin_30883271的博客 1 ### 准备开始 2 --- 3 #### 学员反馈 4 下午感觉要起飞了,给我们点时间练一下 ...后端代码的抽取感觉还可以，前端代码抽取懵，关于哪个需要依赖、注入，哪个不需要依赖、注入，不懂？ 9 10...
  • 没有解决我的问题, 去提问