踩坑记录-elementui的文本域设置宽度不起作用

直接给input设置宽度,效果没实现
踩坑记录-elementui的文本域设置宽度不起作用_第1张图片

踩坑记录-elementui的文本域设置宽度不起作用_第2张图片
为什么会这样呢,因为element ui会自动在外套一层div,对其设置的宽度并没有直接设置在文本域上
踩坑记录-elementui的文本域设置宽度不起作用_第3张图片
解决方法:
踩坑记录-elementui的文本域设置宽度不起作用_第4张图片
踩坑记录-elementui的文本域设置宽度不起作用_第5张图片
完整代码:

<template>
  <div id="app3">

      <el-form :model="book" size="small" inline="true">
        <el-form-item label="书名">
          <el-input autocomplete="off" suffix-icon="“xxxx”"></el-input>
        </el-form-item>
        <el-form-item label="作者">
          <el-input
            type="textarea"
            :rows="16"
            placeholder="请输入内容"
            v-model="textarea"
            style="width: 900px"
          >
          </el-input>
        </el-form-item>
      </el-form>

  </div>
</template>





<script>
export default {
  data() {
    return {
      textarea: "",
      book: "",
    };
  },
  methods: {
   
  },
};
</script>

<style>
.el-form-item :last-child {
width: 100%;
}
</style>

你可能感兴趣的:(前端,elementui,vue.js,前端)