vue.js - 如何更改 Vue 路由器链接的宽度?
问题描述
我有以下代码(IN VUE.JS
):
<template>
<router-link
id="router-link"
>
</router-link>
</template>
<script>
⋮
</script>
<style scoped>
#router-link{
border: 2px solid black;
width: 100px;
}
</style>
问题:
即使我将宽度设置为 100px,router-link
也不会改变它的宽度大小。
有人可以帮我理解为什么这不起作用,是否有可能解决该问题?
解决方案
默认情况下,<router-link>
渲染一个<a>
,通常是display:inline
,忽略宽度。添加display:inline-block
到您的风格以解决问题。
#router-link {
display: inline-block;
width: 100px;
}
推荐阅读
- powershell - Powershell 使用边界 MIME 将 pdf 文件上传到 RightFax Web 服务
- python - 如何从Python中的列表中删除外括号
- javascript - Javascript - 检查数组中每个对象的长度/项目数量?
- javascript - MongoParseError:用户信息部分中未转义的斜杠
- c++ - 当我收到平均为 60 或 70 时,以下 if 语句错误地输出 'D' 和 'F'
- android - 如何在flutter的build方法中调用provider中的方法?
- visual-c++ - Visual C++ 中的 alignof 问题
- kotlin - await 里面 await 或如何获得父范围?科特林
- javascript - 为什么 obj 变量必须在 for 循环内部而不是外部定义?
- python - 对于给定的域列表,我需要在 Python 中返回它们的标签列表